偏愛非主流-自製版型－〆撕鈊裂肺的小窩

自製兩欄式版型(2014/03/016)

解析度為1024X768

側欄欄位靠右

動態黑白版型

適用:ie

/*--- pixnet版型css -偏愛非主流 (側欄在右) 作者:visa30(撕心裂肺) 部落格:http://visa30.pixnet.net/blog ---*/ #comment-form table { width: 96% ; margin: 0 auto ;} #comment-form td , #comment-form th { border: 1px solid #555 ; padding: 3px 5px; } #comment-form input#send-comment { padding: 3px 5px ; } .article-content p{ margin-bottom:1em; } #flash-header{ position: absolute ; top: 0px; left: 45px; } #box302131 .box-title , #box304152 .box-title{ display: none ; } #box302131 a{ display:block ; float:left ; height:30px; width:135px; } #box302131{ position: absolute ; top: 462px; left: 67px; width: 850px ; } #box302131 span{ display: none ; } #box304152.box , #box304152 .box-text , #box302131.box , #box302131 .box-text{ background: none ; } html{background:url() fixed no-repeat -15px -90px;scrollbar-base-color:#000; scrollbar-face-color:#000; scrollbar-arrow-color:#000; scrollbar-3d-light-color:#909090; scrollbar-highlight-color:#909090; scrollbar-shadow-color:#909090; scrollbar-dark-shadow-color:#909090;} a, a:link, a:visited{ color:#000;text-decoration:none;} a:hover{ color:#909090;background-image:url(); text-decoration:none; position:relative;top:2px;left:1px;} body{ font-size: .8em ; font-family:"Arial" ; line-height: 170% ; color:#000 ; background: url(http://i.imgur.com/uzPDlNO.jpg) repeat center top #000; } a{ text-decoration: none ; color:#909090 ; } #authority{width: 150px ; position:relative; top:0px; left:830px; background:#000 ; background: url(http://i.imgur.com/uzPDlNO.jpg) repeat center top } #authority a{ color:#FFF; padding:0px 5px; } #authority a:hover{ color:#909090; } .author{ color:#000; font-weight:bold; font-size:10px;} #container{ } .refer li{ color:#909090; font-weight:bold; font-size:10px;} #container2{ width: 980px ; margin: 0 auto ; position: relative ; background: url(http://i.imgur.com/y0rJUZS.gif) repeat-y left top ; } #main{ *height: 1% ; padding: 0px 60px 0px 60px ; } #main:after{ content:"." ; height: 0 ; display: block ; clear:both ; visibility: hidden ; overflow: hidden ; } #header{ height: 560px; background: url(http://i.imgur.com/lBQT6kl.gif) no-repeat left top ; position: relative ; margin-bottom: 20px ; } #banner{ width: 590px ; height: 300px; margin: 50px 0px 0px 0px ; } #login-bar{ color:#000; text-align:right ; position:relative; top:-4px; left:-600px; font-size: 12px ; z-index: 480 ; position: relative ; } #login-bar a{ font-family: "Verdana" ; color:#000; } #login-bar a:hover{ color:#909090; } #header .skiplink{ display: none ; } #blog-category{ display: none ; } #header h1 a{ font-size: 1.6em ; font-family:"Simhei" ; display: block ; text-align:right ; LINE-HEIGHT: 120% ; position: absolute ; top: 480px ;left:-250px; right: 54px ; width: 450px ; color: #FFF; z-index: 500 ; } #header h2{ display:block ; text-align:right ; line-height: 130% ; position: absolute ; right: 54px; top: 540px; left:-140px; color:#FFF ; width: 440px; z-index: 500 ; } #navigation { position: absolute ; top: 540px ; left: 680px; } #navigation a{ display:block ; height: 45px ; font-size: 1.4em ; font-family:"Simhei" ; color:#FFF ; } #navigation a:hover{ color:#909090; } #navigation a:focus{ outline: none ; } #navigation li{ float:left ; width: 70px ; height: 63px; } #content{ position: absolute ; top: 580px ; left: 30px; width: 630px; float:left ; } #spotlight{ background: url(http://i.imgur.com/GrlIyta.jpg) repeat center top; margin-bottom: 30px; color:#FFF ; padding: 30px 15px ; bordeR: 2px outset #909090; } #spotlight h5{ font-weight:bold ; font-size: 1.2em ; color: #000; position: absolute ; top: 5px ; left: 20px; margin-bottom: 5px ; } #spotlight-text{ } #view-mode{ text-align:right ; } .article{ margin-bottom: 30px; background: url(http://i.imgur.com/gpx62S1.jpg) repeat-y left top ; _height: 1% ; } .article-head{ background: url(http://i.imgur.com/gcWi5Id.jpg) no-repeat left bottom #000 ; padding: 0px 10px 8px 50px ; } .title{ font-size: 1.2em ; letter-spacing: -1px ; } .title a{ margin-left: -30px; color:#000; font-weight:bold ; } .title a:hover{ color:#909090; } .publish{ color:#000; text-align:right ; font-size: .9em ; } .article-body{ padding: 0px 15px ; } .bookmark , .fans-club , .author , .forward , .back-to-top { text-align:right ; } .forward{ padding-bottom: 10px; margin-bottom: 10px; } .more{ text-align:right ; margin: 10px 0px } .more a{ font-size: 1.2em ; } .more a:focus{ outline: none ; } .article-footer{ background: url(http://i.imgur.com/6FT7iTC.jpg) no-repeat left bottom ; padding: 0px 15px 15px 15px ; } .article-footer a{color:#000 } .refer li{color:#000 } .main-list table{ width: 96% ; margin: 0 auto ; } .main-list th , .main-list td{ bordeR: 1px solid #444; padding: 3px 5px ; } .main-list th{ background:#333 ; color:#999; text-align : center ; font-weight: bold ; } .user-post-box{ margin: 10px 0px 10px 0px ; color:#FFF; } .user-post-title{ font-size: 1.2em ; font-family:"Simhei" ; padding: 13px 0px 15px 80px ; background: url() no-repeat 0px 0px; color:#FFF; } #trackback-url{ text-align:right ; } .user-post-text{ margin: 0px 20px; } .single-post{ border-bottom: 1px dashed #444 ; padding: 15px 0px; } .post-photo img{ bordeR: 6px solid #444; } .post-info{ text-align:Right ; margin-bottom: 5px; } #comment-box .post-text{ width: 440px; padding: 0px 10px 0px 10px ; float:right ; } .reply-text{ float:right; width: 430px; color:#666 ; margin-top: 7px; padding: 10px; background:#202020; } .reply-text p{ text-align:right ; } .post-comment{ text-align:center ; margin: 10px 0px ; } .post-comment a{ color:#999 ; font-size: 2em ; font-family:"Simhei" ; } .post-comment a:focus { outline: none ; } .secret{ font-size: 1.2em ; padding-left: 10px; } .page { text-align:center ; margin: 3px 0px; } .page span{ padding: 2px 5px; font-weight:bold ; color:#fff ; } .page a{ padding: 2px 5px; bordeR: 1px solid #333; margin: 0px 1px ; color:#666 ; } .page a:hover{ background:#909090; color:#fff ; } #links-row-1{display: none;} #links{ width: 260px; float:right ; color:#000; position:relative; top:0px;left:40px; } .box{ margin: 0px 0px 30px -10px; background: url(http://i.imgur.com/hjVgn1v.jpg) repeat-y left top ; } .box-title{ background: url(http://i.imgur.com/StKDgpI.jpg) no-repeat left top; padding: 10px 15px 9px 15px ; font-weight:bold ; margin-bottom: 1px; } .box-text{ _height: 1% ; background: url(http://i.imgur.com/ee9bXWO.jpg) no-repeat left bottom ; padding: 0px 10px 10px 10px ; } .box-text a{ display:block ; color:#000 ; } .folder a , .box-more a{ display: inline ; } .box-more{ text-align:Right ; margin-top: 5px; } .box-more img{ position:relative; top:0px; left:-10px; } #search-target{ width: 127px; } #visitor li img , #crumb li img{ width: 36px ; height: 36px; margin: 0px 2px 2px 0px ; } #broadcast ul{ padding: 5px 0px ; border-bottom: 1px dashed #444 ; } .broadcast-photo{ margin-right: 4px; } .broacast-time{ height: 1.4em ; overflow: hidden ; } .broadcast-time a{ display: inline ; } .broadcast-text{ height: 1.4em ; overflow: hidden ; } #headshot-img{ width: 100px ; text-align:center ; float:left ; } #headshot-img img{ bordeR: 3px solid #ddd ; } #headshot .box-text{ _height: 1% ; overflow: hidden ; _overflow: none ; } #calendar table{ width: 90% ; margin: 0 auto ; text-align:center ; font-size: .9em ; } #calendar th , #calendar td{ text-align:center ; } #category .inner-box , #mylink .inner-box{ margin-bottom: 6px; } #category h6 , #mylink h6{ margin-bottom: 3px; font-weight:bold ; } #powered .box-text { text-align:center ; } #footer{ height: 216px; clear:both ; text-align:center ; padding: 15px ; line-height: 130% ; background: url(http://i.imgur.com/KjIwYaS.gif) repeat-y left top ; } #footer a{ } input , select{ font-family:"Arial" ; } #bottom{ display: none; } #visitor li img, #crumb li img{ width: 40px; height: 40px; padding: 3px; border: 1px solid #eee; border-right: 1px solid #333; border-bottom: 1px solid #333; } #visitor ul, #crumb ul{overflow: hidden; _overflow: none; _height: 1%;} #visitor li, #crumb li{ float:left; line-height:0; margin: 0px 3px 3px 0px; display:inline; } #broadcast ul{ _height: 1% ; overflow: hidden ; _overflow: none ; } .broadcast-photo{ float:left ; } .single-post{ _height: 1% ; overflow: hidden ; _overflow: none ; } .post-photo{ width:120px ; float:left ; text-align:Center ; } body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; } table { border-collapse:collapse; border-spacing:0; } fieldset,img { border:0; } address,caption,cite,code,dfn,em,th,var { font-style:normal; font-weight:normal; } ol,ul { list-style:none; } caption,th { text-align:left; } h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; } q:before,q:after { content:''; } abbr,acronym { border:0; } pre{ font-size: 1em ; } .article-content{ _height: 1% ; overflow: hidden ; _overflow: none; } ::-webkit-scrollbar{border:2px ridge #000;background:#000 url();} ::-webkit-scrollbar-thumb{border:2px ridge #FFF;background:#909090;} ::-webkit-scrollbar-button:vertical{border:6px ridge #909090;background:#000;}