FINE LOOK in PIXNET

痞客模版基本樣式 :: 深灰黑(右側欄,主視覺窄)
主視覺圖片預設為 650 X 350
欲加入圖片,
請在CSS中找到 #banner{background: url() left top no-repeat;}
在 ( ) 中加上圖片網址即可。

★★★ 語法下載: (游標移至框內全選後, 按滑鼠右鍵, 或 Ctrl+C 複製語法)
/*主視覺請在此更換*/ #banner{background: url() left top no-repeat;} /*--------------------------reset*/ 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;} .article-content p{margin-bottom: 1em;} a { text-decoration: none; } br{letter-spacing: normal;} /*--------------------------all setting*/ body { font-size: 12px; font-family: arial, verdana; color: #fff; line-height: 160%; background:#ccc;} a { color: #ccc; } a:hover { color: #fff; } #body-div { } /*--------------------------authority*/ #authority { background: #aaa; border-bottom: 1px solid #ccc; text-align: center; line-height: 25px; } #authority a{ margin:0px 5px; color:#ccc;} #authority a:hover{color:#000;} /*--------------------------container*/ #container2 { width: 900px; margin: 0px auto; position: relative; background:#000; border-right:3px solid #aaa; border-left:3px solid #aaa;} /*--------------------------header*/ #header { padding-top: 50px; width: 630px; margin-left: 20px; height: 390px; background: #333;} #login-bar { color: #ccc; position: absolute; left: 30px; top: 415px; text-align: right; } #login-bar .separator { color: #ccc; } #banner { height: 350px; width: 630px; border-top: 5px solid #000; border-bottom: 5px solid #000; } #banner h1 { position: absolute; left: 30px; top: 5px; height: 25px; } #banner h1 a { font: bold 15px arial; } #banner h2 { position: absolute; left: 30px; top: 25px; height: 20px; line-height: 20px; width: 600px; overflow: hidden; } #banner .skiplink { display: none; } #banner #blog-category { display: none; position: absolute; left: 10px; top: 415px; width: 150px; height: 20px; line-height: 20px; } /*--------------------------navigation*/ #navigation { position: absolute; right:15px; top: 10px; width: 220px;} #navigation li { float: left; width: 220px; height: 25px; background:#ccc; margin-bottom:1px;} #navigation a { display: block; color:#000; line-height: 25px; padding: 0px 10px; } #navigation a:hover { background: #aaa; color: #fff; text-align: right;} #navigation li#link-blog{background:#fff;} /*--------------------------main*/ #main { padding-top: 5px; } /*--------------------------content*/ #content { overflow: hidden; float: left; width: 650px; margin-left: 10px; display: inline;} #spotlight { background: #444; margin: 10px; padding: 10px; border:1px solid #111; border-bottom:1px solid #555; border-right:1px solid #555;} #article-area h3{margin-left: 10px} #view-mode { margin-bottom: 20px; margin-left: 10px;} .article { margin:0 10px 20px 10px;} .publish { text-transform: uppercase; font-size: 11px; color: #fff; height: 12px; line-height: 12px; padding: 5px 10px; background:#aaa;} .title { background: #555; margin: 0 0 10px 0; padding: 5px 10px ; border-bottom: 2px solid #333; } .title a{ font:bold 15px arial; color:#fff;} .article-body { text-align: right; margin: 10px 0;} .article-content { font-size: 13px; line-height: 180%; letter-spacing: 0.05em; text-align: left; color: #ccc; } .article-content a { border-bottom: 1px dotted #aaa; } .more a { border: 0; } .bookmark,.author,.forward { color: #999; } .article-footer { padding: 5px 10px; _height: 1%; color: #666; margin: 10px 0; border-top:1px dashed #444;} .article-footer a { color: #999; } .article-footer a:hover { color: #636363; } .back-to-top { text-transform: uppercase; text-align: right; } .back-to-top a { padding: 0px 3px; background: #aaa; color: #fff; font: 11px verdana; } /*--------------------------list*/ .main-list table { width: 95%; margin: 10px auto;} .main-list th { background: #333; color: #eee; padding: 3px; } .list-num { width: 30px; } .list-date { width: 120px; } .list-comment { width: 50px;} .list-visit { width: 70px;} .main-list td { padding: 3px; border-bottom: 1px solid #333; } /*--------------------------post-box*/ .user-post-box { margin: 20px 0; } .user-post-title { margin: 10px 0; color: #fff; padding: 5px 10px; } .post-comment { width: 100px; text-align: center; height: 25px; line-height: 25px; margin: 10px auto; background: #ccc; } #content .post-comment a { display: block; width: 100%; height: 100%; color:#000;} #content .post-comment a:hover { background:#fff;} .single-post { overflow: hidden; _overflow: none; _height: 1%; padding: 10px; margin: 10px auto; position: relative; width: 600px; background:#333;} .post-info { background: #444; height: 40px; margin-bottom: 5px; margin-left: 105px; line-height: 25px; padding: 3px 0 0 10px;} .post-time { position: absolute; left: 125px; top: 25px; color:#666;} .post-photo { position: absolute; left: 10px; top: 10px; width: 90px; height: 90px; } .post-photo img { width: 90px; height: 90px; } .post-text { float: right; width: 490px; padding: 5px 0; } .reply-text { float: right; width: 490px; border-top: 1px dashed #666; text-align: right; color: #999; padding: 5px 0; } .single-post.secret .post-text { float: none; width: auto; } #trackback-box #trackback-url { margin:10px;} #trackback-text .post-info { padding: 5px; margin:0; height: 25px; } #trackback-box .post-text { width: auto ; float: none ; } /*--------------------------comment-form */ #comment-form { background: #222; padding: 10px; width: 600px; margin: 10px auto; } #comment-form p { color: #aaa; 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: #ccc; vertical-align: top; width: 80px; border: none; padding: 2px 5px; text-align: right; } #comment-form input { height: 17px; font-family: Arial; font-size: 11px; color: #ccc; border: none; border-bottom: 1px solid #ccc; background: none; width: 90%; } #comment-form input.radio { border: none; width: auto; background: none; margin: 0; padding: 0; } #comment-form input#blogcommenttext_name { width: 87%; } #comment-form input#send-comment { border: 0; width: 80px; background: #999; color: #fff; } #comment-form textarea { width: 90%; height: 90px; font-family: Arial; font-size: 11px; line-height: 18px; color: #000; border: 1px solid #ccc; background: #fff; } /*--------------------------pages*/ .page { margin: 10px 0; text-align: center;} .page a { padding:0px 5px;} .page SPAN { background:#333; padding:0px 5px; color:#fff;} /*--------------------------links*/ #links { margin-top: -320px; overflow: hidden; float: right; width: 220px; margin-right:15px; display:inline;} #links a{color:#aaa;} #links a:hover{color:#fff;} .box { background: #555; border-left:1px solid #333; border-right:1px solid #333; margin-bottom:1px;} .box-title { background: #333; padding: 10px; font: bold 13px arial; color: #fff; border-bottom: 1px solid #666} .box-text { padding: 10px; border-top:1px solid #333;} .box-more { text-align: right; margin:5px 0;} .box-more a { padding: 2px 5px; background: #333; border: 1px solid #222; } #visitor ul, #crumb ul { overflow: hidden; _overflow: none; _height: 1%; } #visitor li, #crumb li { float: left; line-height: 0; } #visitor li a, #crumb li a { border: 0; } #visitor li img, #crumb li img { margin: 0 2px 2px 0; display: inline; width: 50px; height: 50px; } #broadcast ul { overflow: hidden; _overflow: none; _height: 1%; margin-bottom: 10px; } #broadcast .broadcast-photo { float: left; width: 40px; margin-right: 5px; display: inline; line-height: 20px; } #broadcast .broadcast-time, #broadcast .broadcast-text { float: right; width: 150px; line-height: 20px !important; } #broadcast .broadcast-text a { color:#ccc; line-height: 20px } #broadcast .broadcast-time a { color: #fff; padding: 2px 3px; background: #333; font: 10px verdana; line-height: 20px; } #broadcast .broadcast-time span { display: none; } #headshot ul { overflow: hidden; _overflow: none; _height: 1%; } #headshot li { width: 80px; float: right; } #headshot li a { padding: 2px; } #headshot-img { float: left !important; width: 110px !important; } #headshot-img img { border: 3px solid #eee; } #search ul { overflow: hidden; _overflow: none; _height: 1%; } #search li { float: left; } #search li input { background:#aaa; border: 1px solid #ddd; border-left: 1px solid #333; border-top: 1px solid #333; margin-right: 5px; height: 20px; width: 120px; } #search li input#search-submit { border: 1px solid #ddd; border-right: 1px solid #333; border-bottom: 1px solid #333; height: 22px; width: 50px; padding: 0; color: #000; } #feed a { margin-bottom: 5px; padding: 5px; width: 90%; } #calendar table { width: 80%; margin: 0 auto; } #calendar table th { text-align: center; } #calendar table td { font-size: 10px; text-align: center; line-height: 20px; } #calendar table td a { background: #999; display: block; color: #fff; border: 0; -khtml-border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px; } #category li { margin-left: 15px; } #archive select { width: 200px; margin-bottom: 5px; background: #fff; border: 1px solid #ccc; font: 11px arial; } #murmur .murmur-time { color: #666; font: 11px Century Gothic; } #murmur .murmur-text { padding: 5px 0; } #latest-comment li, #subscription li, #latest-trackback li { margin-bottom: 2px; color: #000; font-size: 12px; } #latest-comment a, #subscription a, #latest-trackback a { display: block; width: 99%; } /*--------------------------footer*/ #footer { clear: both; background: #333; padding: 20px 0; text-align: center; _height: 1%; }