[艾瑪CSS] 2006聖誕極簡白色系＃01~04

[預覽畫面] ＃01襪中的聖誕老公公 ＃02白色聖誕節

使用說明，這兩款只有底圖改變，其他都不變，因此如果要直接複製這兩款過去，請決定要讓他出現哪一張底圖，接著修改不出現的底圖，方式如下：

★ 讓＃01底圖出現

background:#FFF url(http://static.flickr.com/35/72932569_7184f18d2b_o.jpg) top center;/*01底圖*/
/*background:#FFF url(http://static.flickr.com/34/72932542_32fbc0ce28_o.jpg) top center; 02底圖*/

★ 讓＃02底圖出現

/*background:#FFF url(http://static.flickr.com/35/72932569_7184f18d2b_o.jpg) top center; 01底圖*/
background:#FFF url(http://static.flickr.com/34/72932542_32fbc0ce28_o.jpg) top center; /*02底圖*/

簡單改一下就可以同時複製兩個CSS囉～

四張底圖的網址
　

＃1	＃2
http://static.flickr.com/35/72932569_7184f18d2b_o.jpg	http://static.flickr.com/34/72932542_32fbc0ce28_o.jpg
＃3	＃4
http://static.flickr.com/20/72932517_59ef3fcfd3_o.jpg	http://static.flickr.com/34/72932281_656dc7b1c7_o.jpg

/************2006 Xmas CSS＃01&02************/

　

body {
margin: 0px 0px 20px 0px;
background:#FFF;
}
A { color: #336666; text-decoration: none;}
A:link { color: #336666; text-decoration: none; }
A:visited { color: #336666; text-decoration: none; }
A:active { color: #669999; }
A:hover { color: #669999; }

h1, h2, h3 {
margin: 0px;
padding: 0px;
}

#banner {
font-family:verdana, arial, sans-serif;
color:#CC9933;
font-size:x-large;
font-weight:bold;
background:#FFF url(http://static.flickr.com/35/72932569_7184f18d2b_o.jpg) top center;/*01底圖*/
background:#FFF url(http://static.flickr.com/34/72932542_32fbc0ce28_o.jpg) top center; /*02底圖*/
padding-left:15px;
height:750px;
}

#banner a,
#banner a:link,
#banner a:visited,
#banner a:active,
#banner a:hover {
font-family:verdana, arial, sans-serif;
font-size: x-large;
color: #ff0000;
text-decoration: none;
}

.description {
font-family:verdana, arial, sans-serif;
color:#CCC;
font-size:11px;
font-weight:bold;
background:none;
text-transform:none;
letter-spacing: none;
}

#content {
float:left;
width:65%;
background:#FFF;
margin-left:10px;
margin-right:15px;
margin-bottom:20px;
position: absolute;
}

#links {
width:30%;
background:#FFF;
margin-left:68%;
color:#CCC;
margin-top:35px;
margin-right:15px;
position: absolute;
}

.blog {
padding-left:15px;
padding-top:15px;
padding-right:15px;
}
.blogbody img{ max-width: 640px;}
.blogbody {
font-family:verdana, arial, sans-serif;
color:#666;
font-size:small;
font-weight:normal;
background:#FFF;
line-height:160%;
border-left:1px dotted #666;
border-right:1px dotted #666;
border-bottom:1px dotted #666;
padding:10px;
}

.blogbody a,
.blogbody a:link,
.blogbody a:visited,
.blogbody a:active,
.blogbody a:hover {
font-weight: normal;
text-decoration: underline;
}

.title {
font-family: verdana, arial;
font-size: 16px;
color: #CCC;
font-weight:bold;
}

#menu {
margin-bottom:10px;
background:#FFF;
font-size:small;
font-weight:bold;
}

.date {
font-family:verdana, arial, sans-serif;
font-size: 24px;
color: #690;
font-weight:bold;
text-transform:uppercase;
margin-top:50px;
border-bottom:1px dotted #666;
}

.posted {
font-family:verdana, arial, sans-serif;
font-size: x-small;
color: #690;
}

.calendar {
font-family:verdana, arial, sans-serif;
color:#666;
font-size:11px;
font-weight:normal;
padding:5px;
}

.calendarhead {
font-family:verdana, arial, sans-serif;
color:#CC9933;
font-size:11px;
font-weight:bold;
background:#FFF;
line-height:160%;
}

.side {
font-family:verdana, arial, sans-serif;
color:#CCC;
font-size:11px;
font-weight:normal;
background:#FFF;
line-height:160%;
}

.sidetitle {
font-family:verdana, arial, sans-serif;
color:#690;
font-size:16px;
font-weight:bold;
background:#FFF;
line-height:160%;
padding-top:2px;
padding-bottom:2px;
margin-top:10px;
margin-bottom: 5px;
border-bottom:1px dotted #ccc;
letter-spacing: .2em;
}

.syndicate {
font-family:verdana, arial, sans-serif;
font-size:xx-small;
font-weight:bold;
line-height:160%;
padding:2px;
margin-top:10px;
text-align:center;
background:#FFF;
}

.powered {
font-family:verdana, arial, sans-serif;
color:#CCC;
font-size:xx-small;
font-weight:bold;
border-top:1px dotted #666;
border-bottom:1px dotted #666;
line-height:160%;
padding:2px;
margin-top:10px;
text-
align:center;
letter-spacing: .2em
background:#FFF;
}

.comments-body {
font-family:verdana, arial, sans-serif;
color:#666;
font-size:small;
font-weight:normal;
background:#FFF;
line-height:160%;
padding-bottom:10px;
}

.comments-post {
font-family:verdana, arial, sans-serif;
color:#690;
font-size:11px;
font-weight:normal;
background:#FFF;
margin-top:0px;
}

.comments-head {
font-family:verdana, arial, sans-serif;
font-size: 14px;
color: #690;
font-weight:bold;
margin-top:10px;
border-bottom:1px dotted #666;
}

.trackback-body {
font-family:verdana, arial, sans-serif;
color:#333;
font-size:small;
font-weight:normal;
background:#FFF;
line-height:160%;
padding-top:15px;
}

.trackback-url {
font-family:verdana, arial, sans-serif;
color:#666;
font-size:small;
font-weight:normal;
background:#ebebeb;
line-height:160%;
padding:5px;
border:0px dotted #666;
}

.trackback-post {
font-family:verdana, arial, sans-serif;
color:#690;
font-size:11px;
font-weight:normal;
background:#FFF;
margin-bottom:20px;
}

textarea {
border: 1px solid #ccc; height: 250px;
background: none url(http://static.flickr.com/20/72932412_09ba8db5c5.jpg) no-repeat 150px center;
}

　

原文出處: [艾瑪CSS] 2006聖誕極簡白色系＃01~04

延伸閱讀

• [分享] 淡藍極簡BLOG CSS
• [網誌] 深淺雙綠色（已投稿）
• [分享] 淡紫日記BLOG CSS
• [分享] 無名小站回應區、訪客留言、版主回應、誰來我家 完整CSS大公開
• [情人節樣式] 第一號:粉紅小可愛（網誌）
• [情人節樣式] 第一號:粉紅小可愛（相本）
• [情人節樣式] 第一號:粉紅小可愛（個人資料+留言版）
• [艾瑪CSS] 2006聖誕極簡紅色系＃1