〆撕鈊裂肺的小窩

自製兩欄式版型(2014/01/19)

解析度為1024X768

側欄欄位靠右

適用:ie google

複製底下語法貼上即可!

/*----------------------------------------------------------- pixnet版型css - 性感KISS(側欄在右) 作者:visa30(撕心裂肺) 部落格:http://visa30.pixnet.net/blog -----------------------------------------------------------*/ html{border:3px ridge #A00200; background:url(http://i.imgur.com/cXK67iv.gif) fixed repeat -15px -90px;scrollbar-base-color:#000; scrollbar-face-color:#000; scrollbar-arrow-color:#000; scrollbar-3d-light-color:#FF0000; scrollbar-highlight-color:#FF0000; scrollbar-shadow-color:#FF0000; scrollbar-dark-shadow-color:#FF0000;} body { font-size:12px; font-family:arial, Century Gothic; line-height: 160%; background: url() left top repeat; } #blog-main{} #article-main{} a {color:#FFF;} a:hover {color:#909090;text-decoration:none;background-image:url(http://i.imgur.com/zk25BG6.gif);} #body-div{border:2px ridge #A00200; width: 980px;position:relative; top:-2px; background:url(http://i.imgur.com/ypemjsz.gif) left top repeat; position: relative; margin:0 auto 20px; } #authority{ position:absolute; left: 0; top: 470px;left:430px; z-index:9000; } #authority a{ display:block; float: left; height: 20px; line-height: 20px; font-size: 12px; border:1px ridge #FFF; padding: 1px 5px 1px 25px; color:#FFF; } #authority a#newpost { background:url(http://c1img.cyworld.co.kr/img/mall/effect2/nameicon/nameicon_143375.gif) 5px center no-repeat #909090; margin-right:5px; } #authority a#backstage { background:url(http://c1img.cyworld.co.kr/img/mall/effect2/nameicon/nameicon_143375.gif) 5px center no-repeat #909090; } #authority a:hover{ color:#000; border:1px ridge #FFF; } #header{ background:url(http://i.imgur.com/jICTk49.gif) left top no-repeat; height: 500px; } #login-bar{ position:absolute; right:0; top: 0px;left:5px; color:#fff; } #login-bar a{color:#fff; padding:0px 1px;} #login-bar a:hover{color:#909090;} #banner{display: none;} #banner h1 a{ display: none; } #banner h2{ display: none; } #banner .skiplink{display: none;} #banner #blog-category{ display: none; } #banner #blog-category a{display: none; } #container{} #container2{} #container3{} #navigation{ position:absolute; right:1px; top:450px; left:-27px; } #navigation li{ float:left; background:url() left top no-repeat; height: 35px; padding:0px 10px; line-height: 30px; *line-height: 35px; } #navigation a{ font-size:16px; color:#fff; padding-left: 25px; } #navigation a:hover{ color:#fff; } #navigation li#link-album a{background:url(http://c1img.cyworld.co.kr/img/mall/effect2/nameicon/nameicon_143375.gif) 3px 3px no-repeat;} #navigation li#link-blog a{background:url(http://c1img.cyworld.co.kr/img/mall/effect2/nameicon/nameicon_143375.gif) 3px 2px no-repeat;} #navigation li#link-guestbook a{background:url(http://c1img.cyworld.co.kr/img/mall/effect2/nameicon/nameicon_143375.gif) 3px 3px no-repeat;} #navigation li#link-profile a{background:url(http://c1img.cyworld.co.kr/img/mall/effect2/nameicon/nameicon_143375.gif) 3px 3px no-repeat;} #main{ overflow: hidden; _overflow: none; _height: 1%; } #content{ overflow: hidden; float:left; width: 630px; padding-top: 12px; } #spotlight{ width: 592px; margin:10px auto; background:url() left top repeat-y; } #spotlight h5{ background:url(http://i.imgur.com/bK6bjIT.png) left top no-repeat; height: 52px; padding-left: 20px; color:#FFF; font:bold 13px arial; line-height:40px; } #spotlight-text{ padding: 10px; color:#FFF; background:url() left bottom no-repeat; } #article-area{ width: 590px; margin:0 auto; } #article-area .article-area-title{} #view-mode{} #display{} #display SPAN {} #article-box{} .article{ margin-top: 10px; margin-bottom: 20px; } .article-head{ height: 52px; background: url(http://i.imgur.com/bK6bjIT.png) left top no-repeat; position: relative; } .publish { font: 10px arial; text-transform: uppercase; color: #FFF; position: absolute; top: 12px; left: 15px; height:30px; width: 55px; overflow:hidden; text-align: right; } .publish .month, .publish .date{ font-size:15px; font-weight: bold; font-family: Century gothic; letter-spacing: -0.05em; height:15px; color:#fff; } .publish .day, .publish .year{ position:relative; top:-2px; } .publish .time{display:none;} .title{ height: 20px; padding-top: 10px; margin-left: 80px; width: 470px; overflow:hidden; } .title a{position:relative; top:-13px; font-size: 16px; font-weight:bold; color:#FFF; } .title a:hover{color:#FFF;} .article-body{ margin: 10px 0; } .article-body a{color:#FFF;} .article-body a:hover{color:#909090;} .article-content{ margin: 15px; font-size:13px; line-height: 170%; letter-spacing:0.05em; color:#FFF; } .article-content a{ color:#FFF; border-bottom:1px dashed #91b8c1; padding-bottom:1px; } .bookmark, .author, .forward{ text-align: right; color:#FFF; line-height:140%; } .article-footer{ overflow:hidden;_overflow: none; _height: 1%; border-top: 1px dashed #ccc; padding-top:5px; color:#FFF; line-height:140%; } .history{ float: right; width: 290px; } .refer{ float: left; width: 290px; } .back-to-top{ clear: both; text-transform: uppercase; font: 10px Century Gothic; letter-spacing:0; text-align: right; } .back-to-top a{ background:#aaa; padding: 0px 3px; line-height: 20px; color:#fff; } .back-to-top a:hover{ background:#fff; color:#ccc; } .main-list { width: 590px; margin:10px auto; } .main-list table{ width: 100%; margin: 10px auto; } .main-list h3 {} .main-list th{ line-height: 25px; color:#fff; background:#91b8c1; border-bottom: 3px solid #fff; padding: 2px 5px; } .main-list td{ font-size:11px; *font-size:10px; line-height: 25px; padding: 0px 10px; background:#eefbff; border-bottom:1px solid #91b8c1; } .main-list td a{color:#333;} .main-list td a:hover{color:#999;} .list-num{display:none;} td.list-date { font: 9px Tahoma; width: 50px; color:#000; letter-spacing:0; padding: 0 5px; } .list-title img{float: right; margin-left:3px; } #murmur-list td.list-date { padding: 5px; } .list-visit, .list-comment{ width: 40px; } .user-post-box{} .user-post-title{ background:url(http://pic.pimg.tw/pixnetvisual/49dacf2874769.png) no-repeat; height: 25px; line-height: 25px; padding-left: 10px; color:#337f98; margin: 10px 0; } #trackback-box .user-post-title{} #comment-box .user-post-title{} .post-comment{ width:90px; height: 25px; margin: 10px auto 20px; line-height: 25px; } #content .post-comment a{ display:block; font-size:12px; color:#5589a6; height: 100%; padding-left: 25px; background:url(http://pic.pimg.tw/pixnetvisual/49d8d812ccfb6.png) 5px center no-repeat #d9efed; border:1px solid #a6d0de; } #content .post-comment a:hover{ border:1px solid #74afc3; color:#285974; } .single-post{ overflow: hidden; _overflow: none; _height: 1%; background:#e9faff; margin-bottom: 20px; padding-bottom: 10px; border:1px solid #caf2ff; } .post-info{ background:url(http://pic.pimg.tw/pixnetvisual/49dacf29acf4d.png) no-repeat; height:27px; font-size:11px; *font-size:10px; line-height: 27px; margin-bottom: 10px; color:#555; position:relative; padding-left: 55px; _padding-top: 5px; } .post-info img{ vertical-align: middle; } .post-info .floor{ width: 40px; height:25px; text-align: center; color:#fff; font: bold 13px Century Gothic; line-height:25px; display: block; position: absolute; left:0; top:0; } .post-photo{ width: 95px; float: left; margin-left: 10px; display: inline; } .post-photo img{ border:1px solid #ddd; } .post-text{ float: right; width: 470px; margin-bottom: 5px; color:#000; } .reply-text{ float: right; width: 405px; background:url(http://pic.pimg.tw/pixnetvisual/49dacf2a22174.png) 5px top no-repeat #fff; border:1px solid #dcf2f8; border-right:1px solid #c8e8f1; border-bottom:1px solid #c8e8f1; margin-right: 10px; display:inline; padding: 5px 5px 5px 50px; color:#777; min-height: 30px; _height: 30px; } .reply-text p{ display:none; } .single-post.secret{ background:url(http://pic.pimg.tw/pixnetvisual/4970225ac51bf.png) 5px top no-repeat #fff; border:1px solid #ccc; } .single-post.secret .post-text{ float: none; width: auto; padding-left: 70px; font-size:0; color:#fff; } #trackback-box {} #trackback-box h3 {} #trackback-box SPAN {} #trackback-box #trackback-url{ margin: 10px 0; } #trackback-box input{ border:1px solid #dcf2f8; font:11px arial; padding:2px; margin-left:5px; background:#fff; color:#369 } #trackback-box input#trackback-input{ width: 350px; margin:0; padding:3px } #trackback-text {} #trackback-text .single-post {} #trackback-text .post-info {} #trackback-box .post-text{ width:auto ; float:none ; padding: 0 10px; } #comment-form { border:1px solid #dcf2f8; background:#e8f2f5; padding: 10px 5px; width: 580px; margin: 10px auto; } #comment-form p { color: #369; text-align: right; margin: 0px 10px 5px; } #comment-form table { width: 100%; border: none; } #comment-form table tr.comment-form-title { display: none; } #comment-form table td { color: #999; vertical-align: top; border: none; padding: 2px 5px; } #comment-form table th { color: #999; vertical-align: top; width: 70px; border: none; padding: 2px 5px; text-align:right; } #comment-form table th font { display: none; } #comment-form input { height: 17px; font-family: Arial; font-size: 11px; color: #000; border: none; border-bottom: 1px solid #ccc; background: none; width: 99%; } #comment-form input.radio { border: none; width: auto; background: none;margin:0; padding:0; } #comment-form input#blogcommenttext_name{ width: 95.5%; } #comment-form input#send-comment{ background:#ccc; width: 100px; height: 20px; } #comment-form textarea { width: 99%; height: 90px; font-family: Arial; font-size: 11px; line-height: 18px; color: #000; border: 1px solid #ccc; background: #fff; } .page{ margin: 10px 0px; font-size:11px; font-family: Century Gothic; text-align: center; } .page a{ margin: 0 5px; color:#555; padding: 0 3px; } .page a:hover, .page span{ background:#eee; padding: 0 3px; color:#33; } #links{width:268px ;float:right ;position: relative;right:20px;margin-top:16px;} #links-row-1{} #links-row-2{} .box{ margin: 15px 0 } .box-title{ background:url(http://i.imgur.com/BS6PXuv.png) no-repeat; height:52px; padding: 15px 5px 0 33px; color:#fff; font-weight:bold; font-size:13px; } .box-text { padding:10px 0; color:#FFF; } .box-text a{color:#FFF;} .box-text a:hover{color:#909090;} .box li{ background:url() left bottom no-repeat; padding: 0 10px; line-height:220%; } .box h6{ margin-left: 10px; line-height:200%; font-weight:bold; } .box-more{ margin: 5px 10px; text-align:right; } .box-more a{ border:1px solid #fff; border-right: 1px ridge #FFF; border-bottom:1px ridge #FFF; padding: 1px 3px; color:#FFF; } .box-more a:hover{ border:1px ridge #FFF; border-right: 1px ridge #fff; border-bottom:1px ridge #fff; } #box-ad .box-text, #hiiir .box-text, #boxevent_clubbroadcast .box-text, #archive .box-text, #favorite .box-text{ margin: 0 15px; } #headshot { background:url(http://pic.pimg.tw/pixnetvisual/49dacf27a4d4c.png) left top no-repeat; width: 250px; height:105px; margin: 15px auto; position: relative; } #headshot .box-title{ background:none; padding: 0 0 0 30px; } #headshot .box-text{ padding:0; margin:0; } #headshot ul{ } #headshot li{background:none;} #headshot li#headshot-img{ background:none; width: 75px; line-height:0; padding:0; position: absolute; top: 15px; right:20px; } #headshot li#headshot-img img{ width:70px; padding: 2px; border:2px ridge #a00200; background:#909090; } #headshot li#friend-apply{ position:absolute; top: 33px; left: 30px; } #headshot li#send-message{ position:absolute; top: 60px; left:30px; } #recent-article{} #recent-article img{} #latest-comment {} #latest-comment a{} #latest-comment span{} #calendar{} #calendar table{ width: 70%; margin: 0 auto; } #calendar th, #calendar td{ color:#FFF; font: 11px Century Gothic; text-align: center; line-height: 20px; } #calendar td{ padding: 2px 1px; } #calendar td a{ display: block; padding: 0px 1px; background:#909090; color:#FFF; border-right:1px ridge #FFF; border-bottom:1px ridge #FFF; } #murmur{ width: 250px; margin: 15px auto; background:#FFF; position:relative; } #murmur .box-title{ background:url(http://pic.pimg.tw/pixnetvisual/49dacf28d6a77.png) left top no-repeat; height:35px; padding:0 0 0 27px; } #murmur .box-text{ margin:0; padding: 5px 0; _height:1%; } #murmur .box-text li{ background:none; } .murmur-time{ position: absolute; left:15px; top: 17px; font: 10px Century Gothic; color:#FFF; } .murmur-text{ padding: 10px !important; line-height:150% !important; } #visitor, #crumb{} #visitor ul,#crumb ul{ overflow: hidden; _overflow: none; _height: 1%; margin:5px 15px; } #visitor li,#crumb li{ float: left; margin: 0px 2px 2px 0; display:inline; line-height:0; padding:0; background:0; } #visitor li img, #crumb li img { width: 50px; height: 50px; } #visitor .box-more, #crumb .box-more{ margin-top: 10px; } #broadcast{} #broadcast ul{ overflow: hidden; _overflow: none; _height: 1%; padding-bottom: 3px; margin-bottom: 5px; padding: 0px 15px 7px 15px; background:url(http://pic.pimg.tw/pixnetvisual/49dacf28052b9.png) left bottom no-repeat; } #broadcast li{ background:0; padding:0; } #broadcast .broadcast-photo{ float: left; line-height:0; } #broadcast .broadcast-time{ float: right; width: 185px; line-height: 20px; } #broadcast .broadcast-time a{} #broadcast .broadcast-time span{} #broadcast .broadcast-text{ float: right; width: 185px; height: 20px; line-height: 20px; overflow: hidden; } #search{} #search ul{ overflow: hidden; _overflow: none; _height: 1%; margin: 0px 15px; } #search li{ float: left; background:none; padding:0; } #search li input{ border:1px ridge #909090; font:12px arial; margin-right: 5px; line-height: 20px; padding:2px; } #search input#search-target{} #search input#search-submit{ padding:1px; width: 50px; color:#FFF; background:#909090; } #feed {} #announce{} #hot-article {} #category {} #category h6{color:#a00200} #category ul{margin-bottom: 5px;} #category .box-more {} #archive select {} #archive li a{} #latest-trackback {} #latest-trackback a{} #latest-trackback span{} #subscription{} #subscription a{} #subscription span{} #favorite select {} #mylink {} #mylink .inner-box{margin-bottom: 5px;} #mylink .inner-box h6{color:#fff} #mylink .inner-box li{} #counter{} #counter SPAN{} #latest-comment li, #subscription li, #latest-trackback li{ line-height: 150%; padding: 3px 10px; } #latest-comment a, #latest-trackback a, #subscription a{ display: block; width: 99%; } .folder{} .folder .box-title{} .folder .box-text{ margin: 0px 10px; } #powered{} #footer{ clear:both; background:url() left 0px no-repeat; padding: 20px 10px 0 10px; height: 50px; text-align:center; border-top: 0; } #footer p{color: #000;} #bottom {} #extradiv11{} #extradiv10{} #extradiv9{} #extradiv8{} #extradiv7{} #extradiv6{} #extradiv5{} #extradiv4{} #extradiv3{} #extradiv2{} #extradiv1{} #extradiv0{} body{cursor:URL(https://dl.dropboxusercontent.com/u/132512035/ani/red%20neon%20point.ani);} a:hover{cursor:URL(https://dl.dropboxusercontent.com/u/132512035/ani/Busy.ani);} ::-webkit-scrollbar{border:2px ridge #a00200;background:#000 url();} ::-webkit-scrollbar-thumb{border:2px ridge #a00200;background:#996600;} ::-webkit-scrollbar-button:vertical{border:6px ridge #a00200;background:#996600;} .page{ margin: 10px 0px; font-size:11px; font-family: Century Gothic; text-align: center; } .page a{ margin: 0 5px; color:#FFF; padding: 0 3px; } .page a:hover, .page span{ background:#909090; padding: 0 3px; color:#33; } #pixblogad.pixblogad-new{display:none !important; border:0px; background:transparent;}

本著作 係採用創用 CC姓名標示-

非商業性-禁止改作 2.5 台灣 授權條款授權.

請正確引用:尊重創作人!