本文引用自ru6854 - 痞客樣式01 韓式少女 綠 兩欄式右側欄較寬 留言版樣式01
翔霏學習版-痞客樣式01預覽圖 兩欄式右欄
建議解析度1024X768以上
更多背景特效 將陸續收集
版型語法複製↓
body {font-family:arial, verdana, Helvetica, sans-serif;
-webkit-text-size-adjust:none;font-size:12px;
background:url(http://i.imgur.com/Hl10cpz.jpg);
color:#333;line-height:150%;
background-image:url(http://i.imgur.com/Hl10cpz.jpg);
background-position:undefined;}
* {margin:0;padding:0;}
table {border-collapse:collapse;
border-spacing:0;}
address,caption,cite,code,dfn,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:'';}
pre {font-size:1em;}
.article-content {_height:1%;
overflow:hidden;
_overflow:none;
color:#107070;
text-align:left;
margin:10px 0;}
.article-content p {margin-bottom:1em;}
a {text-decoration:none;
color:#107070;}
br {letter-spacing:normal;}
a:hover {color:#00C4C4;}
#authority {border-bottom:1px dashed #107070;
text-align:center;
padding:5px 0;}
#authority a {text-shadow:1px 1px 0 #fff;
margin:0 5px;}
#container2 {width:910px;
background:url(http://i.imgur.com/KuSfNzU.jpg) left top repeat-y;
margin:0 auto;}
#header {height:365px;overflow:hidden;
position:relative;
background:url(http://i.imgur.com/JbFrJ0U.jpg) no-repeat;
background-image:url(http://i.imgur.com/JbFrJ0U.jpg);
background-position:undefined;
background-repeat:no-repeat;}
#login-bar {position:absolute;
left:0;
top:35px;
color:#107070;}
#login-bar a {color:#107070;}
#banner h1 {position:absolute;
left:30px;
top:90px;
height:20px;
width:250px;
overflow:hidden;}
#banner h1 a {font-size:15px;
color:#00cc00;
font-weight:bold;
line-height:20px;
text-shadow:1px 1px 0 #fff;}
#banner h2 {position:absolute;
left:30px;
top:130px;
font-size:9px \9;
color:#00cc00;
height:30px;
width:300px;
line-height:15px;
overflow:hidden;}
#blog-category {position:absolute;
top:80px;
left:500px;
font-size:15px;
color:#107070;}
}
#blog-category a {color:#107070;}
#navigation {position:absolute;
left:20px;
top:210px;}
#navigation li {float:left;
height:25px;}
#navigation li a {display:block;
width:100%;
height:100%;
font-size:0;
text-indent:-5000px;}
#navigation #link-album {width:65px;}
#navigation #link-blog {width:93px;}
#navigation #link-guestbook {width:93px;}
#navigation #link-profile {width:65px;}
#main {background:url(http://i.imgur.com/KuSfNzU.jpg) no-repeat;
overflow:hidden;
_overflow:none;
_height:1%;
padding:20px;}
#content {float:left;
width:625px;
overflow:hidden;}
#spotlight {-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
background:#107070;
border:1px solid #3AA5A5;
margin:0 10px 30px;
padding:10px 15px;}
#spotlight h5 {color:#fc0;
font-weight:bold;
font-size:15px;
margin-bottom:5px;
text-shadow:1px 1px 0 #107070;}
#spotlight-text {color:#107070;}
.article {_height:1%;
margin-bottom:20px;
border-bottom:1px dotted #FF7F7C;
padding-bottom:20px;}
.article-head {_height:1%;}
.publish {font-size:11px;
font-family:verdana;
height:24px;
text-shadow:1px 1px 0 #FF7F7C;
padding-top:14px;
padding-left:50px;
background:url(http://i.imgur.com/6g7DykJ.jpg) no-repeat;
color:#fff;}
.title {_height:1%;
padding:5px 10px;}
.title a {color:#107070;
font-weight:bold;
font-size:20px;
text-shadow:1px 1px 0 #fff;}
.title a img {display:inilne;}
.article-body {text-align:right;
color:#107070;
margin:10px;}
.article-footer {-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
background:#97E2DC;
margin:10px;
padding:10px;}
.back-to-top {text-align:right;
text-transform:uppercase;
text-shadow:1px 1px 0 #eee;}
.article-area-title,#view-mode {color:#97E2DC;}
.main-list {-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
background:#C9F3F0;
margin:10px;
padding:20px;}
.main-list th {border-bottom:2px solid #00FFFF;
padding:5px;}
.main-list td {border-bottom:1px solid #2ADFDF;
padding:5px;}
.user-post-box {_height:1%;
margin-bottom:30px;}
.user-post-title {height:50px;
margin-bottom:20px;
font-size:0;
text-indent:-5000px;
background:url(http://i.imgur.com/Hu0nLsP.jpg) no-repeat;}
#comment-box .user-post-title {background:url(http://i.imgur.com/Hu0nLsP.jpg) left bottom no-repeat;}
.single-post {-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
overflow:hidden;
_overflow:none;
_height:1%;
width:580px;
background:#97E2DC;
border:1px solid #BCF6F1;
margin:10px auto;
padding:10px;}
.post-info {color:#107070;
font-size:12px;
font-family:tahoma;
font-weight:bold;
margin-bottom:5px;
text-shadow:1px 1px 0 #fff;
float:left;
width:500px;}
.post-photo {float:right;
width:60px;}
.post-photo img {width:50px;
height:50px;
border:1px solid #ccc;
padding:2px;}
.post-text {color:#C40000;
float:left;
width:500px;}
.reply-text {border-top:1px dashed #FF7F7C;
padding-top:5px;
color:#C675EC;
margin-top:5px;
float:left;
width:500px;}
.single-post.secret .post-text {float:none;
width:auto;}
#trackback-url {text-align:right;
padding:10px;}
#trackback-box input#trackback-input {width:300px;}
#trackback-box .post-text {width:auto;
float:none;}
.page {text-align:center;
padding:20px;}
.page a,.page SPAN {-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
border:1px solid #9CEBAE;
color:#9CEBAE;
margin:0 1px;
padding:3px 10px;}
.page a:hover {background:#00C4C4;
border:1px solid #00C4C4;
color:#fff;}
.page SPAN {color:#666;}
#links {margin-top:120px;
float:right;
width:220px;
overflow:hidden;}
.box {_height:1%;
margin-bottom:20px;}
.box-title {background:url(http://i.imgur.com/elBzwEF.jpg) no-repeat;
padding-left:45px;
font-weight:bold;
color:#0F4A4A;
font-size:20px;
font-family:華康行書體;
text-shadow:1px 1px 0 #FFFF00;
height:30px;
line-height:30px;}
.box-text {color:#888;
font-size:15px;
line-height:20px;
padding:10px!important;}
.box-more {text-align:right;
margin:5px 0;}
.box-more a {font-size:11px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
background:#9CEBAE;
color:#fff;
padding:2px 5px;}
#user-info dl dd {margin:0;}
#user-info .user-img {margin-bottom:5px;
width:95px;}
#user-info .user-img img {-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
background:#fff;
border:1px solid #ccc;
padding:3px;}
#calendar th,#calendar td {text-align:center;
padding:1px;}
#calendar td a {-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
background:#97E2DC;
color:#107070;
display:block;
margin:1px;}
#search ul,#visitor ul,#crumb ul {overflow:hidden;
_overflow:none;
_height:1%;
margin-bottom:5px;}
#visitor li,#crumb li {float:left;
line-height:0;
margin:2px;}
#visitor li img,#crumb li img {width:40px;
height:40px;
background:#fff;
border:1px solid #000;
padding:1px;}
#search li {float:left;
margin-right:3px;}
#latest-trackback a,#latest-comment a,#subscription a {display:block;
width:99%;}
#footer {clear:both;
background:url(http://i.imgur.com/mGvxKT1.jpg) no-repeat;
padding-top:50px;
height:100px;
text-align:center;}
#bottom,#bottom a {color:#107070;}
input,textarea {vertical-align:middle;
font-family:Helvetica, Arial, "LiHei Pro", PMingLiU, sans-serif;
font-size:1em;
color:#666;
border:1px solid #ccc;
background:#fff;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
padding:2px 5px;}
select {font-family:Helvetica, Arial, "LiHei Pro", PMingLiU, sans-serif;
font-size:1em;
color:#666;
border:1px solid #ccc;
background:#fff;
width:90%;
padding:2px;}
#header h1 a {color:#0cc;
font-size:14pt;}
#header h1 a:link,#header h1 a:visited,#header h1 a:hover,#header h1 a:active {color:#0cc;}
#header h1 {font-size:14pt;}
#header h2 {color:#0cc;
font-size:12pt;}
fieldset,img,abbr,acronym {border:0;}
#banner .skiplink,.time,.title img,.post-comment,#recent-article img {display:none;}
.main-list table,#calendar table {width:100%;}
#latest-trackback li,#latest-comment li,#subscription li,#announce li,#recent-article li,#hot-article li,#category li,#latest-comment li,#latest-trackback li,#subscription li {
margin-bottom:3px;}
#container #links-row-1 div.hslice[id*="-mib-"], #container #links-row-1 div.hslice[id*="-Mib-"], #container #links-row-1 div.hslice[id*="-mIb-"], #container #links-row-1 div.hslice[id*="-miB-"]{
display:none !important;}
/*此語法只有pixnet可以用,請不要擅自亂改語法及圖片喔!*/
/*將這段語法貼在CSS最下面就可以囉!*/
#visitor ul{left:20px;width:180px;height:195px;background:
url(http://i.imgur.com/E7726Id.gif);
margin-left:13px;padding-left:15px;padding-top:105px;}
#visitor IMG {}
#visitor .box-text li a{ height:45px;width:45px;
display:block;
MARGIN: 5px;
background:#FFF url(http://i.imgur.com/coC2CsX.gif) no-repeat center center;}
#visitor .box-text li a:hover {background:none;}
#visitor .box-text li a img{visibility:hidden;height:45px;width:45px;}
#visitor .box-text li a:hover img{visibility:visible;height:45px;width:45px}
#visitor .box-text li { float: left;}
#visitor .box-text ul{}
#visitor .box-more{clear:both;}
a, a:link, a:visited{color:#107070;text-decoration:none;}
a:hover{color:#C675EC;position:relative;top:2px;background:url(http://) repeat-x bottom;}
html{SCROLLBAR-FACE-COLOR:#97E2DC;
SCROLLBAR-HIGHLIGHT-COLOR:#FFFFFF;
SCROLLBAR-3DLIGHT-COLOR:#FFFFFF;
SCROLLBAR-ARROW-COLOR:#FFFFFF;
SCROLLBAR-DARKSHADOW-COLOR:#97E2DC;}
#category .box-text h6 img{display:none;}
#category .box-text h6 {
background-image:url(http://cute.pro.vexp.idv.tw/blogimg07042.gif);
background-repeat:no-repeat;
background-position:left center;color:#107070;
line-height:30px;
padding-left:25px;font-size:16px}
#category .box-text li a{background-image:url(http://cute.pro.vexp.idv.tw/cros1-icon-f06_sZQv.gif);
background-repeat:no-repeat;
background-position:1px 1px;
padding-left:22px}
#category .box-text li a:hover{background-image:url(http://cute.pro.vexp.idv.tw/blogimg07042.gif);
background-repeat:no-repeat}
padding-left:22px
翔霏學習版-痞客留言板01預覽圖
留言板語法複製↓
body {font-family: 'trebuchet ms', verdana, sans-serif;
background:#81D2CC url(http://i.imgur.com/LRc89jZ.jpg) repeat-x top;
color:#000000;
font-size:12px ;
margin:0;}
#Container{background:url(http://i.imgur.com/HXsT89x.jpg) repeat-y center;
width: 901px;
margin: 0 auto;
text-align: left;}
#pageHeader{background:url(http://i.imgur.com/xLkxcCa.jpg) no-repeat top center;
color:#000000;
width:901px;
height:500px;}
#navbar {padding:0px 10px;
position:relative;
top:445px;
left:-30px;
color:#0C7A6F;
margin:0 auto;
text-align:right;}
.navBarLink {color:#0C7A6F}
.navBarLink a, .navBarLink a:visited, .navBarLink a:active {color:#0C7A6F }
.navBarLink a:hover {color:#0C7A6F}
#gbheader {}
.adblock {padding-bottom:10px;}
.gbTopic {padding: 10px 0px 0px 55px;}
.gbTopic a {
color: #6c2b07;
font-family: Arial, Helvetica, sans-serif;
line-height: 23px;
font-size: 14px;
text-decoration: none;}
.gbDescr {color: #C40000;
font-family: Arial, Helvetica, sans-serif;
line-height: 20px;
font-size: 12px;
text-decoration: none;
float:left;
padding: 5px 0px 0px 80px;
clear: both;}
#gbbody {clear:both;
width: 700px;
margin: 0 auto;}
#gbfooter {}
#pageFooter {color:#187773;clear: both;
width:901px;
height:90px;
background:#81D2CC url(http://i.imgur.com/a0HVX9E.jpg) no-repeat center top;}
#footernav {float:left;
margin-top:80px;
padding-left:35px;}
#copyright {float:right;
margin-top:80px;
padding-right:35px;
color:#aaa;}
.crtxt {color: #187773;
font-family: Arial, Helvetica, sans-serif;
line-height: 23px;
font-size: 12px;
text-decoration: none;}
a:hover {font-family: Arial, Helvetica, sans-serif;
color: #187773;
text-decoration: none;}
a.styleLink {font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 23px;
color: #0C7A6F;
text-decoration: underline;}
a.styleLinkNow {font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
line-height: 23px;
color: blue;}
.styleTxt {font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 23px;
color: #0C7A6F;
text-decoration: none;}
.gbBox {background:#C0EAE6;
margin:0 auto 30px auto;
width:700px;}
.spacerDiv{clear:both;}
.gbBoxLeft {width:150px;
border:0px;
float:left;}
.gbBoxRight {width:550px;
float:right;}
.gbUserImg {border-right: 0px;}
.ImgTd {text-align:center;
padding: 10px;
height:90px;}
.UsernameTd {text-align:center;
padding: 7px 0px 3px 0px;
height:25px;}
.UserlinkTd {padding: 7px 0px 3px 0px;
height:25px;
text-align:center;}
.UserlinkTd table {margin:0 auto;}
.UserlinkTd a span{display:none;}
.UserlinkTd a {display:block;
width:16px;
height:16px;}
.linkMail a {background:url(http://s.pixfs.net/f.pixnet.net/css/gb/images/email.gif) center; }
.linkURL a {background:url(http://s.pixfs.net/f.pixnet.net/css/gb/images/www.gif) center no-repeat; }
.linkIP a {background:url(http://s.pixfs.net/f.pixnet.net/css/gb/images/info.gif) center no-repeat; }
.linkDelete a {background:url(http://s.pixfs.net/f.pixnet.net/css/gb/images/delete.png) center no-repeat;}
.loggedIn {padding-left:15px;
background: url(http://s.pixfs.net/f.pixnet.net/css/gb/images/vuser.gif) left no-repeat;}
.InnerBox {border-collapse: collapse;
width:520px;
margin:10px;}
.fieldName {width:80px;
text-align:right;
padding-right:5px;
border-bottom: 1px solid #81D2CC;}
.field {border-bottom: 1px solid #81D2CC;
text-align:left;
padding: 2px 5px;}
.gbTitle {color: #0C7A6F;
font-family: Arial, Helvetica, sans-serif;
line-height: 23px;
font-size: 14px;
text-decoration: none;
font-weight: bold;}
.gbReplyTd {background:#CEFEFE;}
.gbReply {color:#446D8C;
background:#CEFEFE;}
.userPanel {float:right; margin-right:-30px; margin-top:2px; margin-bottom:80px;}
.userPanel a {color:#187773}
.userComment {clear:both;
position:relative;
top:-50px;
text-align:center;
text-align: center;}
.pageSelector {text-align:center;
margin: 0 auto;
width:680px;
height:33px;
background:#C0EAE6;}
.pageSelectorTop {position: relative;
top:-22px;
padding-top:5px;
padding-left:20px;}
.pageSelectorBtm {margin-top:10px;
padding-top:5px;
padding-left:20px;}
.InnerBox input {border: 1px solid gray;
padding: 2px;
width:95%;}
input.radio {border: 0px;
width: 5%;}
.PrivateMsg {display:block;
padding:20px;
background: url(http://s.pixfs.net/f.pixnet.net/css/gb/images/permdeny.gif) no-repeat 38% 50%;
border: 1px dashed gray;
font-size: 14px;
color: #187773;
font-weight: bold;}
.outGB {font-size: 11px;
color: #187773;}
html{SCROLLBAR-FACE-COLOR:#97E2DC;
SCROLLBAR-HIGHLIGHT-COLOR:#FFFFFF;
SCROLLBAR-3DLIGHT-COLOR:#FFFFFF;
SCROLLBAR-ARROW-COLOR:#FFFFFF;
SCROLLBAR-DARKSHADOW-COLOR:#97E2DC;}
★翔霏作品素材皆取自網路加工 如造成原創不悅請告知 翔霏將立即移除