今天是除夕,我沒辦法發紅包給大家,就改寫了三年前寫的CSS,加上最新功能的部分,也把醜醜的回應底線移除,想要下載的朋友請自行下載或複製。 改寫的CSS我會另PO新文,這裡先寫最新功能的CSS囉~
回覆區的CSS語法,無名在發表新功能後,還改了回應區的架構,
我用 1~5 號標出區塊,看大家要改哪裡自己想辦法啦!
Selected Category: ╔ 艾瑪のCSS分享 (71)
- Feb 05 Tue 2008 17:20
[分享] 無名小站回應區、訪客留言、版主回應、誰來我家 完整CSS大公開
- Feb 03 Sat 2007 00:00
[情人節樣式] 第一號:粉紅小可愛(網誌)
提醒:
1) 請開啟 Firefox 程式以利取用CSS程式碼。
2) 此樣式可於PIXNET中,張貼於WRETCH適用樣式中。
★ 請至 [艾瑪CSS] 情人節一號 此篇文章中預覽樣式效果說明:如果覺得透明度會延遲你的網頁速度
感覺變得頓頓的
請將 content 中的 filter 那一行拿掉即可
請從下行/***起開始全部複製。
- Feb 03 Sat 2007 00:00
[情人節樣式] 第一號:粉紅小可愛(相本)
提醒:
1) 請開啟 Firefox 程式以利取用CSS程式碼。
2) 此樣式可於PIXNET中,張貼於WRETCH適用樣式中。
★ 請至 [艾瑪CSS] 情人節一號 此篇文章中預覽樣式效果請從下行/***起開始全部複製。
- Feb 03 Sat 2007 00:00
[情人節樣式] 第一號:粉紅小可愛(個人資料+留言版)
提醒:
1) 請開啟 Firefox 程式以利取用CSS程式碼。
2) 此樣式可於PIXNET中,張貼於WRETCH適用樣式中。
★ 請至 [艾瑪CSS] 情人節一號 此篇文章中預覽樣式效果請從下行/***起開始全部複製。
- Dec 07 Thu 2006 13:40
[艾瑪CSS] 2006聖誕極簡紅色系#1
/**提醒:無名小站部落格中若有超過640px大小的圖片者,不適宜使用此CSS。**/
/**PIXNET使用者請依照[推薦] Pixnet 新功能 Photo Auto-resize設定圖片顯示大小**/
HTML {
SCROLLBAR-FACE-COLOR: #BD6D6B;
SCROLLBAR-HIGHLIGHT-COLOR: #fff;
SCROLLBAR-SHADOW-COLOR: #fff;
SCROLLBAR-3DLIGHT-COLOR: #BD6D6B;
SCROLLBAR-ARROW-COLOR: #fff;
SCROLLBAR-TRACK-COLOR: #BD6D6B;
SCROLLBAR-DARKSHADOW-COLOR: #BD6D6B
}
BODY {
BACKGROUND: #BD6D6B url(http://static.flickr.com/20/72931529_40cddbb342_o.jpg) fixed no-repeat center top;
MARGIN: 0px 0px 0px 0px;
}
A {
FONT-WEIGHT: normal;
COLOR: #999966;
TEXT-DECORATION: none
}
A:link,
A:visited {
COLOR: #8b5f65;
TEXT-DECORATION: none
}
A:active ,
A:hover {
COLOR: #cd919e
}
H1, H2, H3 {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 0px
}
#banner {
TEXT-ALIGN: left;
PADDING-RIGHT: 0px;
PADDING-LEFT: 20px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 20px;
HEIGHT: 140px
}
#banner A,
#banner A:link ,
#banner A:visited,
#banner A:active,
#banner A:hover {
FONT-WEIGHT: bold;
FONT-SIZE: 24px;
COLOR: #fff;
TEXT-DECORATION: none
}
#banner .description {
FONT-WEIGHT: bold;
FONT-SIZE: small;
COLOR: #fff;
FONT-FAMILY: times, serif
}
INPUT,
SELECT,
TEXTAREA{
BORDER:#8b5f65 1px solid;
COLOR:#4f4f4f;
BACKGROUND:#ffffff;
}
#main2{BACKGROUND:#BD6D6B;}
#content {
RIGHT: 10px;
LEFT: 0px;
padding-left:10px;
BOTTOM: 20px;
POSITION: absolute;
TOP: 700px;
width: 660px;
background:#BD6D6B;
filter: alpha(opacity=90);}
#container {
MARGIN: 5px;
BACKGROUND:#BD6D6B
}
#links {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
BACKGROUND:#BD6D6B;
LEFT: 700px;
PADDING-BOTTOM: 10px;
WIDTH: 280px;
PADDING-TOP: 10px;
POSITION: absolute;
TOP: 700px;
}
.blog {
PADDING-RIGHT: 50px;
PADDING-LEFT: 15px;
WIDTH: 650px;
PADDING-TOP: 15px;
BACKGROUND:#BD6D6B;
}
.blogbody {
BORDER: #fff 1px solid;
PADDING-TOP: 10px;
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
PADDING-BOTTOM: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: 13px;
MARGIN-BOTTOM: 10px;
COLOR: #666;
LINE-HEIGHT: 160%;
FONT-FAMILY: verdana, arial, sans-serif;
BACKGROUND-COLOR: #ffffff;
}
.blogbody A,
.blogbody A:link,
.blogbody A:visited,
.blogbody A:active ,
.blogbody A:hover {
FONT-WEIGHT: normal;
TEXT-DECORATION: underline
}
.side A,
.side A:link,
.side A:visited {
FONT-size: 11px;
color:black;
}
.side A:active ,
.side A:hover{
color: white;
TEXT-DECORATION: underline
}
.title {
BACKGROUND-POSITION: left 50%;
PADDING-LEFT: 16px;
FONT-WEIGHT: bold;
FONT-SIZE: medium;
MARGIN-BOTTOM: 7px;
COLOR: #8b5742;
PADDING-TOP: 2px;
BACKGROUND-REPEAT: no-repeat;
FONT-FAMILY: verdana, arial
}
#menu {
BACKGROUND:#BD6D6B;
MARGIN-BOTTOM: 15px
}
.date {
MARGIN-TOP: 23px;
FONT-WEIGHT: bold;
FONT-SIZE: large;
TEXT-TRANSFORM: uppercase;
COLOR: #000;
FONT-FAMILY: verdana, arial, sans-serif
}
.posted {
FONT-SIZE: x-small;
BACKGROUND-IMAGE: none;
MARGIN-BOTTOM: 7px;
COLOR: #999;
FONT-FAMILY: verdana, arial, sans-serif
}
.calendar {
PADDING-RIGHT: 2px;
PADDING-LEFT: 2px;
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 2px;
COLOR: #666;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
FONT-FAMILY: verdana, arial, sans-serif;
TEXT-ALIGN: center
}
DIV.calendar TABLE {
WIDTH: 88%
}
.calendarhead {
PADDING-RIGHT: 2px;
PADDING-LEFT: 2px;
FONT-WEIGHT: bold;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 2px;
COLOR: #8b7765;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
FONT-FAMILY: verdana, arial, sans-serif
}
.side {
PADDING-RIGHT: 7px;
PADDING-LEFT: 7px;
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 3px;
TEXT-TRANSFORM: uppercase;
COLOR: #fff;
LINE-HEIGHT: 160%;
PADDING-TOP: 3px;
FONT-FAMILY: verdana, arial, sans-serif
}
.sidetitle {
BACKGROUND-POSITION: left 50%;
MARGIN-TOP: 10px;
PADDING-LEFT: 18px;
FONT-WEIGHT: bold;
FONT-SIZE: 16px;
TEXT-TRANSFORM: uppercase;
COLOR: #fff;
PADDING-TOP: 2px;
BORDER-BOTTOM: #000 1px dotted;
BACKGROUND-REPEAT: no-repeat;
FONT-FAMILY: verdana, arial, sans-serif;
LETTER-SPACING: 0.2em;
TEXT-ALIGN: center
}
.syndicate {
PADDING-RIGHT: 2px;
MARGIN-TOP: 10px;
PADDING-LEFT: 2px;
FONT-WEIGHT: bold;
FONT-SIZE: xx-small;
BACKGROUND: none;
PADDING-BOTTOM: 2px;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
FONT-FAMILY: verdana, arial, sans-serif;
TEXT-ALIGN: center
}
.powered {
PADDING-RIGHT: 2px;
BORDER-TOP: #ccc 0px solid;
MARGIN-TOP: 10px;
PADDING-LEFT: 2px;
FONT-SIZE: x-small;
PADDING-BOTTOM: 2px;
COLOR: #003366;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
BORDER-BOTTOM: #ccc 0px solid;
FONT-FAMILY: verdana, arial, sans-serif;
LETTER-SPACING: 0.2em;
TEXT-ALIGN: center
}
.comments-head {
BORDER-RIGHT: #cdb7b5 1px solid;
PADDING-RIGHT: 3px;
BORDER-TOP: #cdb7b5 1px solid;
MARGIN-TOP: 5px;
PADDING-LEFT: 3px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
MARGIN-BOTTOM: 5px;
PADDING-BOTTOM: 3px;
BORDER-LEFT: #cdb7b5 1px solid;
COLOR: #666;
PADDING-TOP: 3px;
BORDER-BOTTOM: #cdb7b5 1px solid;
FONT-FAMILY: georgia, verdana, arial, sans-serif;
BACKGROUND-COLOR: #fff0f5
}
.comments-body {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
BACKGROUND: #fffafa;
PADDING-BOTTOM: 10px;
MARGIN: 5px;
COLOR: #cc9999;
LINE-HEIGHT: 160%;
PADDING-TOP: 5px;
FONT-FAMILY: verdana, arial, sans-serif
}
.comments-post {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 0px;
COLOR: #999;
PADDING-TOP: 0px;
FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-body {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
BACKGROUND: #fff;
PADDING-BOTTOM: 10px;
COLOR: #666;
LINE-HEIGHT: 160%;
PADDING-TOP: 10px;
FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-url {
BORDER-RIGHT: #ccc 1px dashed;
PADDING-RIGHT: 10px;
BORDER-TOP: #ccc 1px dashed;
PADDING-LEFT: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
BACKGROUND: #fff;
PADDING-BOTTOM: 10px;
BORDER-LEFT: #ccc 1px dashed;
COLOR: #666;
LINE-HEIGHT: 160%;
PADDING-TOP: 10px;
BORDER-BOTTOM: #ccc 1px dashed;
FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-post {
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: #fff;
COLOR: #666;
FONT-FAMILY: verdana, arial, sans-serif
}
#footer {
BACKGROUND-POSITION-X: left;
BACKGROUND-IMAGE: none;
BACKGROUND-REPEAT: no-repeat
}
.boxRssList1{
width:220px;
height:220px;
overflow: auto;
overflow-x:hidden;
SCROLLBAR-FACE-COLOR: #BD6D6B;
SCROLLBAR-HIGHLIGHT-COLOR: #cdb7b5;
SCROLLBAR-SHADOW-COLOR: #cdb7b5;
SCROLLBAR-3DLIGHT-COLOR: #BD6D6B;
SCROLLBAR-ARROW-COLOR: #cdb7b5;
SCROLLBAR-TRACK-COLOR: #BD6D6B;
SCROLLBAR-DARKSHADOW-COLOR: #BD6D6B
}
.boxFolder {
width:220px;
height:160px;
overflow: auto;
overflow-x:hidden;
SCROLLBAR-FACE-COLOR: #BD6D6B;
SCROLLBAR-HIGHLIGHT-COLOR: #cdb7b5;
SCROLLBAR-SHADOW-COLOR: #cdb7b5;
SCROLLBAR-3DLIGHT-COLOR: #BD6D6B;
SCROLLBAR-ARROW-COLOR: #cdb7b5;
SCROLLBAR-TRACK-COLOR: #BD6D6B;
SCROLLBAR-DARKSHADOW-COLOR: #BD6D6B
}
原文出處: [艾瑪CSS] 2006聖誕極簡紅色系#1
- Dec 07 Thu 2006 13:36
[艾瑪CSS] 2006聖誕極簡紅色系#2
/**提醒:無名小站部落格中若有超過640px大小的圖片者,不適宜使用此CSS。**/
/**PIXNET使用者請依照[推薦] Pixnet 新功能 Photo Auto-resize設定圖片顯示大小**/
HTML {
SCROLLBAR-FACE-COLOR: #B50008;
SCROLLBAR-HIGHLIGHT-COLOR: #fff;
SCROLLBAR-SHADOW-COLOR: #fff;
SCROLLBAR-3DLIGHT-COLOR: #B50008;
SCROLLBAR-ARROW-COLOR: #fff;
SCROLLBAR-TRACK-COLOR: #B50008;
SCROLLBAR-DARKSHADOW-COLOR: #B50008
}
BODY {
BACKGROUND: #B50008 url(http://static.flickr.com/20/72893464_abbc39653b_o.jpg) fixed no-repeat center top;
MARGIN: 0px 0px 0px 0px;
}
A {
FONT-WEIGHT: normal;
COLOR: #999966;
TEXT-DECORATION: none
}
A:link,
A:visited {
COLOR: #8b5f65;
TEXT-DECORATION: none
}
A:active ,
A:hover {
COLOR: #cd919e
}
H1, H2, H3 {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 0px
}
#banner {
TEXT-ALIGN: left;
PADDING-RIGHT: 0px;
PADDING-LEFT: 20px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 20px;
HEIGHT: 140px
}
#banner A,
#banner A:link ,
#banner A:visited,
#banner A:active,
#banner A:hover {
FONT-WEIGHT: bold;
FONT-SIZE: 24px;
COLOR: #fff;
TEXT-DECORATION: none
}
#banner .description {
FONT-WEIGHT: bold;
FONT-SIZE: small;
COLOR: #fff;
FONT-FAMILY: times, serif
}
INPUT,
SELECT,
TEXTAREA{
BORDER:#8b5f65 1px solid;
COLOR:#4f4f4f;
BACKGROUND:#ffffff;
}
#main2{BACKGROUND:#B50008;}
#content {
RIGHT: 10px;
LEFT: 0px;
padding-left:10px;
BOTTOM: 700px;
POSITION: absolute;
TOP: 700px;
width: 660px;
background:#B50008;
filter: alpha(opacity=90);
}
#container {
MARGIN: 5px;
BACKGROUND:#B50008
}
#links {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
BACKGROUND:#B50008;
LEFT: 700px;
margin-BOTTOM: 200px;
WIDTH: 280px;
PADDING-TOP: 10px;
POSITION: absolute;
TOP: 700px;
}
.blog {
PADDING-RIGHT: 50px;
PADDING-LEFT: 15px;
WIDTH: 650px;
PADDING-TOP: 15px;
BACKGROUND:#B50008;
}
.blogbody {
BORDER: #fff 1px solid;
PADDING-TOP: 10px;
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
PADDING-BOTTOM: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: 13px;
MARGIN-BOTTOM: 10px;
COLOR: #666;
LINE-HEIGHT: 160%;
FONT-FAMILY: verdana, arial, sans-serif;
BACKGROUND-COLOR: #ffffff;
}
.blogbody A,
.blogbody A:link,
.blogbody A:visited,
.blogbody A:active ,
.blogbody A:hover {
FONT-WEIGHT: normal;
TEXT-DECORATION: underline
}
.side A,
.side A:link,
.side A:visited {
FONT-size: 11px;
color:black;
}
.side A:active ,
.side A:hover{
color: white;
TEXT-DECORATION: underline
}
.title {
BACKGROUND-POSITION: left 50%;
PADDING-LEFT: 16px;
FONT-WEIGHT: bold;
FONT-SIZE: medium;
MARGIN-BOTTOM: 7px;
COLOR: #8b5742;
PADDING-TOP: 2px;
BACKGROUND-REPEAT: no-repeat;
FONT-FAMILY: verdana, arial
}
#menu {
BACKGROUND:#B50008;
MARGIN-BOTTOM: 15px
}
.date {
MARGIN-TOP: 23px;
FONT-WEIGHT: bold;
FONT-SIZE: large;
TEXT-TRANSFORM: uppercase;
COLOR: #000;
FONT-FAMILY: verdana, arial, sans-serif
}
.posted {
FONT-SIZE: x-small;
BACKGROUND-IMAGE: none;
MARGIN-BOTTOM: 7px;
COLOR: #999;
FONT-FAMILY: verdana, arial, sans-serif
}
.calendar {
PADDING-RIGHT: 2px;
PADDING-LEFT: 2px;
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 2px;
COLOR: #666;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
FONT-FAMILY: verdana, arial, sans-serif;
TEXT-ALIGN: center
}
DIV.calendar TABLE {
WIDTH: 88%
}
.calendarhead {
PADDING-RIGHT: 2px;
PADDING-LEFT: 2px;
FONT-WEIGHT: bold;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 2px;
COLOR: #8b7765;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
FONT-FAMILY: verdana, arial, sans-serif
}
.side {
PADDING-RIGHT: 7px;
PADDING-LEFT: 7px;
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 3px;
TEXT-TRANSFORM: uppercase;
COLOR: #fff;
LINE-HEIGHT: 160%;
PADDING-TOP: 3px;
FONT-FAMILY: verdana, arial, sans-serif
}
.sidetitle {
BACKGROUND-POSITION: left 50%;
MARGIN-TOP: 10px;
PADDING-LEFT: 18px;
FONT-WEIGHT: bold;
FONT-SIZE: 16px;
TEXT-TRANSFORM: uppercase;
COLOR: #fff;
PADDING-TOP: 2px;
BORDER-BOTTOM: #000 1px dotted;
BACKGROUND-REPEAT: no-repeat;
FONT-FAMILY: verdana, arial, sans-serif;
LETTER-SPACING: 0.2em;
TEXT-ALIGN: center
}
.syndicate {
PADDING-RIGHT: 2px;
MARGIN-TOP: 10px;
PADDING-LEFT: 2px;
FONT-WEIGHT: bold;
FONT-SIZE: xx-small;
BACKGROUND: none;
PADDING-BOTTOM: 2px;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
FONT-FAMILY: verdana, arial, sans-serif;
TEXT-ALIGN: center
}
.powered {
PADDING-RIGHT: 2px;
BORDER-TOP: #ccc 0px solid;
MARGIN-TOP: 10px;
PADDING-LEFT: 2px;
FONT-SIZE: x-small;
PADDING-BOTTOM: 2px;
COLOR: #003366;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
BORDER-BOTTOM: #ccc 0px solid;
FONT-FAMILY: verdana, arial, sans-serif;
LETTER-SPACING: 0.2em;
TEXT-ALIGN: center
}
.comments-head {
BORDER-RIGHT: #cdb7b5 1px solid;
PADDING-RIGHT: 3px;
BORDER-TOP: #cdb7b5 1px solid;
MARGIN-TOP: 5px;
PADDING-LEFT: 3px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
MARGIN-BOTTOM: 5px;
PADDING-BOTTOM: 3px;
BORDER-LEFT: #cdb7b5 1px solid;
COLOR: #666;
PADDING-TOP: 3px;
BORDER-BOTTOM: #cdb7b5 1px solid;
FONT-FAMILY: georgia, verdana, arial, sans-serif;
BACKGROUND-COLOR: #fff0f5
}
.comments-body {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
BACKGROUND: #fffafa;
PADDING-BOTTOM: 10px;
MARGIN: 5px;
COLOR: #cc9999;
LINE-HEIGHT: 160%;
PADDING-TOP: 5px;
FONT-FAMILY: verdana, arial, sans-serif
}
.comments-post {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 0px;
COLOR: #999;
PADDING-TOP: 0px;
FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-body {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
BACKGROUND: #fff;
PADDING-BOTTOM: 10px;
COLOR: #666;
LINE-HEIGHT: 160%;
PADDING-TOP: 10px;
FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-url {
BORDER-RIGHT: #ccc 1px dashed;
PADDING-RIGHT: 10px;
BORDER-TOP: #ccc 1px dashed;
PADDING-LEFT: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
BACKGROUND: #fff;
PADDING-BOTTOM: 10px;
BORDER-LEFT: #ccc 1px dashed;
COLOR: #666;
LINE-HEIGHT: 160%;
PADDING-TOP: 10px;
BORDER-BOTTOM: #ccc 1px dashed;
FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-post {
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: #fff;
COLOR: #666;
FONT-FAMILY: verdana, arial, sans-serif
}
#footer {
BACKGROUND-POSITION-X: left;
BACKGROUND-IMAGE: none;
BACKGROUND-REPEAT: no-repeat
}
.boxRssList1{
width:220px;
height:220px;
overflow: auto;
overflow-x:hidden;
SCROLLBAR-FACE-COLOR: #B50008;
SCROLLBAR-HIGHLIGHT-COLOR: #cdb7b5;
SCROLLBAR-SHADOW-COLOR: #cdb7b5;
SCROLLBAR-3DLIGHT-COLOR: #B50008;
SCROLLBAR-ARROW-COLOR: #cdb7b5;
SCROLLBAR-TRACK-COLOR: #B50008;
SCROLLBAR-DARKSHADOW-COLOR: #B50008
}
.boxFolder {
width:220px;
height:160px;
overflow: auto;
overflow-x:hidden;
SCROLLBAR-FACE-COLOR: #B50008;
SCROLLBAR-HIGHLIGHT-COLOR: #cdb7b5;
SCROLLBAR-SHADOW-COLOR: #cdb7b5;
SCROLLBAR-3DLIGHT-COLOR: #B50008;
SCROLLBAR-ARROW-COLOR: #cdb7b5;
SCROLLBAR-TRACK-COLOR: #B50008;
SCROLLBAR-DARKSHADOW-COLOR: #B50008
}
原文出處: [艾瑪CSS] 2006聖誕極簡紅色系#2
- Dec 07 Thu 2006 13:20
[艾瑪CSS] 2006聖誕極簡紅色系#3
/**提醒:無名小站部落格中若有超過640px大小的圖片者,不適宜使用此CSS。**/
/**PIXNET使用者請依照[推薦] Pixnet 新功能 Photo Auto-resize設定圖片顯示大小**/
HTML {
SCROLLBAR-FACE-COLOR: #DEAACE;
SCROLLBAR-HIGHLIGHT-COLOR: #fff;
SCROLLBAR-SHADOW-COLOR: #fff;
SCROLLBAR-3DLIGHT-COLOR: #DEAACE;
SCROLLBAR-ARROW-COLOR: #fff;
SCROLLBAR-TRACK-COLOR: #DEAACE;
SCROLLBAR-DARKSHADOW-COLOR: #DEAACE
}
BODY {
BACKGROUND: #DEAACE fixed repeat left top;
MARGIN: 0px 0px 0px 0px;
}
A {
FONT-WEIGHT: normal;
COLOR: #999966;
TEXT-DECORATION: none
}
A:link,
A:visited {
COLOR: #8b5f65;
TEXT-DECORATION: none
}
A:active ,
A:hover {
COLOR: #cd919e
}
H1, H2, H3 {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 0px
}
#banner {
background:url(http://static.flickr.com/34/72931730_893edcb6c4_o.jpg) no-repeat center top;
TEXT-ALIGN: left;
PADDING-RIGHT: 0px;
PADDING-LEFT: 20px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 20px;
HEIGHT: 700px
}
#banner A,
#banner A:link ,
#banner A:visited,
#banner A:active,
#banner A:hover {
FONT-WEIGHT: bold;
FONT-SIZE: 24px;
COLOR: #fff;
TEXT-DECORATION: none
}
#banner .description {
FONT-WEIGHT: bold;
FONT-SIZE: small;
COLOR: #fff;
FONT-FAMILY: times, serif;
text-align:left;
}
INPUT,
SELECT,
TEXTAREA{
BORDER:#8b5f65 1px solid;
COLOR:#4f4f4f;
BACKGROUND:#ffffff;
}
#main2{BACKGROUND:#DEAACE;}
#content {
RIGHT: 10px;
LEFT: 0px;
padding-left:10px;
BOTTOM: 20px;
POSITION: absolute;
TOP: 700px;
width: 660px;
background:#DEAACE;
/*filter: alpha(opacity=90);*/
}
#container {
MARGIN: 5px;
BACKGROUND:#DEAACE
}
#links {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
BACKGROUND:#DEAACE;
LEFT: 700px;
PADDING-BOTTOM: 10px;
WIDTH: 280px;
PADDING-TOP: 10px;
POSITION: absolute;
TOP: 700px;
}
.blog {
PADDING-RIGHT: 50px;
PADDING-LEFT: 15px;
WIDTH: 650px;
PADDING-TOP: 15px;
BACKGROUND:#DEAACE;
}
.blogbody {
BORDER: #fff 1px solid;
PADDING-TOP: 10px;
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
PADDING-BOTTOM: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: 13px;
MARGIN-BOTTOM: 10px;
COLOR: #666;
LINE-HEIGHT: 160%;
FONT-FAMILY: verdana, arial, sans-serif;
BACKGROUND-COLOR: #ffffff;
}
.blogbody A,
.blogbody A:link,
.blogbody A:visited,
.blogbody A:active ,
.blogbody A:hover {
FONT-WEIGHT: normal;
TEXT-DECORATION: underline
}
.side A,
.side A:link,
.side A:visited {
FONT-size: 11px;
color:black;
}
.side A:active ,
.side A:hover{
color: white;
TEXT-DECORATION: underline
}
.title {
BACKGROUND-POSITION: left 50%;
PADDING-LEFT: 16px;
FONT-WEIGHT: bold;
FONT-SIZE: medium;
MARGIN-BOTTOM: 7px;
COLOR: #8b5742;
PADDING-TOP: 2px;
BACKGROUND-REPEAT: no-repeat;
FONT-FAMILY: verdana, arial
}
#menu {
BACKGROUND:#DEAACE;
MARGIN-BOTTOM: 15px
}
.date {
MARGIN-TOP: 23px;
FONT-WEIGHT: bold;
FONT-SIZE: large;
TEXT-TRANSFORM: uppercase;
COLOR: #000;
FONT-FAMILY: verdana, arial, sans-serif
}
.posted {
FONT-SIZE: x-small;
BACKGROUND-IMAGE: none;
MARGIN-BOTTOM: 7px;
COLOR: #999;
FONT-FAMILY: verdana, arial, sans-serif
}
.calendar {
PADDING-RIGHT: 2px;
PADDING-LEFT: 2px;
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 2px;
COLOR: #666;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
FONT-FAMILY: verdana, arial, sans-serif;
TEXT-ALIGN: center
}
DIV.calendar TABLE {
WIDTH: 88%
}
.calendarhead {
PADDING-RIGHT: 2px;
PADDING-LEFT: 2px;
FONT-WEIGHT: bold;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 2px;
COLOR: #8b7765;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
FONT-FAMILY: verdana, arial, sans-serif
}
.side {
PADDING-RIGHT: 7px;
PADDING-LEFT: 7px;
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 3px;
TEXT-TRANSFORM: uppercase;
COLOR: #fff;
LINE-HEIGHT: 160%;
PADDING-TOP: 3px;
FONT-FAMILY: verdana, arial, sans-serif
}
.sidetitle {
BACKGROUND-POSITION: left 50%;
MARGIN-TOP: 10px;
PADDING-LEFT: 18px;
FONT-WEIGHT: bold;
FONT-SIZE: 16px;
TEXT-TRANSFORM: uppercase;
COLOR: #fff;
PADDING-TOP: 2px;
BORDER-BOTTOM: #000 1px dotted;
BACKGROUND-REPEAT: no-repeat;
FONT-FAMILY: verdana, arial, sans-serif;
LETTER-SPACING: 0.2em;
TEXT-ALIGN: center
}
.syndicate {
PADDING-RIGHT: 2px;
MARGIN-TOP: 10px;
PADDING-LEFT: 2px;
FONT-WEIGHT: bold;
FONT-SIZE: xx-small;
BACKGROUND: none;
PADDING-BOTTOM: 2px;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
FONT-FAMILY: verdana, arial, sans-serif;
TEXT-ALIGN: center
}
.powered {
PADDING-RIGHT: 2px;
BORDER-TOP: #ccc 0px solid;
MARGIN-TOP: 10px;
PADDING-LEFT: 2px;
FONT-SIZE: x-small;
PADDING-BOTTOM: 2px;
COLOR: #003366;
LINE-HEIGHT: 160%;
PADDING-TOP: 2px;
BORDER-BOTTOM: #ccc 0px solid;
FONT-FAMILY: verdana, arial, sans-serif;
LETTER-SPACING: 0.2em;
TEXT-ALIGN: center
}
.comments-head {
BORDER-RIGHT: #cdb7b5 1px solid;
PADDING-RIGHT: 3px;
BORDER-TOP: #cdb7b5 1px solid;
MARGIN-TOP: 5px;
PADDING-LEFT: 3px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
MARGIN-BOTTOM: 5px;
PADDING-BOTTOM: 3px;
BORDER-LEFT: #cdb7b5 1px solid;
COLOR: #666;
PADDING-TOP: 3px;
BORDER-BOTTOM: #cdb7b5 1px solid;
FONT-FAMILY: georgia, verdana, arial, sans-serif;
BACKGROUND-COLOR: #fff0f5
}
.comments-body {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
BACKGROUND: #fffafa;
PADDING-BOTTOM: 10px;
MARGIN: 5px;
COLOR: #cc9999;
LINE-HEIGHT: 160%;
PADDING-TOP: 5px;
FONT-FAMILY: verdana, arial, sans-serif
}
.comments-post {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: none;
PADDING-BOTTOM: 0px;
COLOR: #999;
PADDING-TOP: 0px;
FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-body {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
BACKGROUND: #fff;
PADDING-BOTTOM: 10px;
COLOR: #666;
LINE-HEIGHT: 160%;
PADDING-TOP: 10px;
FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-url {
BORDER-RIGHT: #ccc 1px dashed;
PADDING-RIGHT: 10px;
BORDER-TOP: #ccc 1px dashed;
PADDING-LEFT: 10px;
FONT-WEIGHT: normal;
FONT-SIZE: small;
BACKGROUND: #fff;
PADDING-BOTTOM: 10px;
BORDER-LEFT: #ccc 1px dashed;
COLOR: #666;
LINE-HEIGHT: 160%;
PADDING-TOP: 10px;
BORDER-BOTTOM: #ccc 1px dashed;
FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-post {
FONT-WEIGHT: normal;
FONT-SIZE: x-small;
BACKGROUND: #fff;
COLOR: #666;
FONT-FAMILY: verdana, arial, sans-serif
}
#footer {
BACKGROUND-POSITION-X: left;
BACKGROUND-IMAGE: none;
BACKGROUND-REPEAT: no-repeat
}
.boxRssList1{
width:220px;
height:220px;
overflow: auto;
overflow-x:hidden;
SCROLLBAR-FACE-COLOR: #DEAACE;
SCROLLBAR-HIGHLIGHT-COLOR: #cdb7b5;
SCROLLBAR-SHADOW-COLOR: #cdb7b5;
SCROLLBAR-3DLIGHT-COLOR: #DEAACE;
SCROLLBAR-ARROW-COLOR: #cdb7b5;
SCROLLBAR-TRACK-COLOR: #DEAACE;
SCROLLBAR-DARKSHADOW-COLOR: #DEAACE
}
.boxFolder {
width:220px;
height:160px;
overflow: auto;
overflow-x:hidden;
SCROLLBAR-FACE-COLOR: #DEAACE;
SCROLLBAR-HIGHLIGHT-COLOR: #cdb7b5;
SCROLLBAR-SHADOW-COLOR: #cdb7b5;
SCROLLBAR-3DLIGHT-COLOR: #DEAACE;
SCROLLBAR-ARROW-COLOR: #cdb7b5;
SCROLLBAR-TRACK-COLOR: #DEAACE;
SCROLLBAR-DARKSHADOW-COLOR: #DEAACE
}
原文出處: [艾瑪CSS] 2006聖誕極簡紅色系#3
- Dec 06 Wed 2006 20:30
[艾瑪CSS] 2006聖誕極簡白色系#01~04
使用說明,這兩款只有底圖改變,其他都不變,因此如果要直接複製這兩款過去,請決定要讓他出現哪一張底圖,接著修改不出現的底圖,方式如下:
★ 讓#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囉~
/************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
- Dec 06 Wed 2006 17:20
[艾瑪CSS] 2006聖誕極簡三色系
又有一陣子沒有玩CSS了,因為太多CSS高手,輪不到我這種小卡司來跑龍套。不過,下午一時手癢玩了一下下,拿了最簡單的樣式來取代幾個數值,就變成上面這個樣子了,屬於最簡單、最清爽的頁面種類。不知道還可以嗎?
這樣的CSS就是跟每次刊載巴黎漫遊記事時的版頭一樣,一開頁面會呈現全版的圖片(有點像是傳統首頁樣式),往下捲才看得到本文,有好有壞。好處是還蠻清爽的,壞處是有人的網路下載FLICKR照片很慢(不過一張圖也沒幾K,應該還好),再說還有快取可以讀,所以不至於會慢到變成龜速吧。
我找了三種色系,總共十八張圖,想要把他做成紅、白、藍三種色系的CSS(其中紅色有一款去年我做過),有人有興趣嗎?如果沒有人有興趣,那我就不要獻醜了:P
[艾瑪CSS] 2006聖誕極簡藍色系#01 #02
[艾瑪CSS] 2006聖誕極簡藍色系#03 #04
[艾瑪CSS] 2006聖誕極簡藍色系#05 #06
原文出處: [艾瑪CSS] 2006聖誕三色系
- Sep 07 Thu 2006 08:00
[艾瑪CSS] 清新綠野。小王子與小狐狸全套(已截止)
CSS 大方送又來了!!!
- 版本:[清新綠野] 之 小王子與小狐狸
- 版本特色:即使是非VIP也可以消除相本和留言版廣告
- 拿取CSS的原則:不可改動CSS、不再次分享
- 補充說明:http://www.wretch.cc/blog/tarosan&article_id=5045867
(相本、留言板需固定背景可以修改)- 時間:2006/9/7 18:00~24:00 (密碼六點準時公布)已截止!
- 對象:
***幫艾瑪投票送我去巴黎的所有朋友(如果你來不及拿取,請留悄悄話文中包含「艾瑪,我有投票給你喔!」並留下你的 MAIL,我會寄給你!)一天之內,也就是至 9/9 00:00有效喔~ 留言前,請確認您曾經在這篇文章中留過言。若不符合上述,恕不寄送。
***上述時間有到訪艾瑪隨處走走的留言訪客
- Sep 07 Thu 2006 04:00
[艾瑪CSS] 清新綠野。小王子與小狐狸(blog)
- Sep 07 Thu 2006 03:00
[艾瑪CSS] 清新綠野。小王子與小狐狸(gb)
- Sep 07 Thu 2006 02:00
[艾瑪CSS] 清新綠野。小王子與小狐狸(album)
- Sep 07 Thu 2006 01:00
[艾瑪CSS] 清新綠野。小王子與小狐狸(user)
- Aug 03 Thu 2006 12:00
[CSS] 小王子網誌CSS贈送

























健固金華讓你帶著長輩出國趴趴走
◎ Blog|部落格.你知道及不知道的...(14)









