自從買了"愛上我的無名小站" ,就陷入了無止盡的專業用語的漩渦中,
想要動手做個版,實在不是件容易的事情,因為專有名詞看不懂,還好
書中介紹的很詳盡,不過目前還是無法自己撰寫,至少基本的用語已經
可以理解,就這樣先動手做了一個我與兒子都愛的哆啦A夢版,讓自己
回味一下童年!

哆啦A夢 CSS

 HTML {
 SCROLLBAR-FACE-COLOR: #a3e2ff; SCROLLBAR-HIGHLIGHT-COLOR: #60cdff; SCROLLBAR-SHADOW-COLOR: #e0f5ff; SCROLLBAR-3DLIGHT-COLOR: #fff; SCROLLBAR-ARROW-COLOR: #e0f5ff; SCROLLBAR-TRACK-COLOR: #c2ecff; SCROLLBAR-DARKSHADOW-COLOR: #60cdff
}
BODY {
 PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #fff repeat-y 40% 40%; PADDING-BOTTOM: 0px; MARGIN: 0px; FONT: 0.8em Arial; COLOR: #888; PADDING-TOP: 0px
}
A {
 COLOR: #6666ff
}
A:hover {
 COLOR: #cc9900; TEXT-DECORATION: none
}
#container1 {
 MARGIN: 0px auto; WIDTH: 900px
}
#banner {
 BACKGROUND: url(http://pic9.pic.wretch.cc/photos/1/j/jakeandy/16/1136178283.jpg) no-repeat right top; HEIGHT: 375px
}
#banner H1 {
 PADDING-RIGHT: 0px; PADDING-LEFT: 20px; FONT-WEIGHT: normal; FONT-SIZE: 20px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 170px
}
#description2 {
 PADDING-LEFT: 30px; FONT-SIZE: 15px; WIDTH: 320px; COLOR: #888
}
#content {
 FLOAT: left; WIDTH: 620px
}
.date {
 PADDING-LEFT: 80px; FONT-SIZE: 20px; BACKGROUND: url(http://p7.p.pixnet.net/albums/userpics/7/9/226379/1160466139.jpg) no-repeat left top; COLOR: #0275c5; PADDING-TOP: 3px; LETTER-SPACING: -1px; HEIGHT: 55px
}
.articletext {
 BORDER-RIGHT: 1px solid; PADDING-RIGHT: 20px; BORDER-TOP: 1px solid; PADDING-LEFT: 20px; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid
}
.title {
 COLOR: #cc6699
}
.innertext {
 FONT-SIZE: small; MARGIN-LEFT: 0px; COLOR: #777; LINE-HEIGHT: 160%; FONT-STYLE: normal; LETTER-SPACING: 0px
}
.extended {
 TEXT-ALIGN: right
}
.posted {
 FONT-SIZE: 11px; MARGIN-BOTTOM: 15px; COLOR: #cc6699; TEXT-ALIGN: center
}
.comments-head {
 PADDING-LEFT: 50px; FONT-SIZE: 15px; BACKGROUND: url(http://pic9.pic.wretch.cc/photos/1/j/jakeandy/16/1136178278.jpg) no-repeat left top; COLOR: #ffb4b4; PADDING-TOP: 3px; FONT-FAMILY: simhei; LETTER-SPACING: -1px; HEIGHT: 30px
}
.comments-body {
 PADDING-RIGHT: 20px; PADDING-LEFT: 20px
}
.comments-body P {
 PADDING-BOTTOM: 10px; MARGIN: 0px; PADDING-TOP: 10px
}
.comments-post {
 BACKGROUND: #eef5ff; MARGIN-BOTTOM: 10px; TEXT-ALIGN: right
}
#links {
 FONT-SIZE: 15px; FLOAT: right; WIDTH: 170px
}
.sidetitle {
 BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; PADDING-LEFT: 43px; FONT-WEIGHT: bold; BACKGROUND: url(http://pic9.pic.wretch.cc/photos/1/j/jakeandy/16/1136178284.jpg) no-repeat left top; BORDER-LEFT: 1px solid; COLOR: #cc9900; PADDING-TOP: 20px; BORDER-BOTTOM: 1px solid; HEIGHT: 20px
}
.side {
 PADDING-RIGHT: 10px; PADDING-LEFT: 10px
}
DIV.calendar {
 FONT-SIZE: 13px
}
#boxNewComment .side {
 FONT-SIZE: 13px; TEXT-ALIGN: right
}
#boxNewCommnet .side BR {
 DISPLAY: none
}
#boxNewComment .side A {
 DISPLAY: block; FONT-SIZE: 12px; TEXT-ALIGN: left
}
TEXTAREA {
 BORDER-RIGHT: #6b8e23 1px solid; BACKGROUND-POSITION: 50% 80%; BORDER-TOP: #6b8e23 1px solid; FONT-SIZE: 10pt; BORDER-LEFT: #6b8e23 1px solid; COLOR: #000000; BORDER-BOTTOM: #6b8e23 1px solid
}
TEXTAREA {
 BORDER-RIGHT: #6b8e23 1px dashed; BORDER-TOP: #6b8e23 1px dashed; FONT-SIZE: 10pt; BACKGROUND-IMAGE: url(http://pic9.pic.wretch.cc/photos/1/j/jakeandy/16/1136178286.jpg); BORDER-LEFT: #6b8e23 1px dashed; BORDER-BOTTOM: #6b8e23 1px dashed; BACKGROUND-REPEAT: no-repeat
}
A:link {
 COLOR: #6666ff
}
A:visited {
 COLOR: #6666ff
}
A:active {
 COLOR: #6666ff
}


arrow
arrow
    全站熱搜

    jakeandy 發表在 痞客邦 留言(8) 人氣()