|
整 個 痞 客 邦 相 關 資 訊，
包 含
﹝樣 板 作 者、樣 式 型 態﹞
... 等 資 訊。
|
/*------------------- #Generate By Pixnet ------------------------ */
/*------------------------ #comment-table ------------------------ */
#comment-form table { width: 96% ; margin: 0 auto ;}
#comment-form td , #comment-form th { border: 1px solid #555 ; padding: 3px 5px; }
#comment-form input#send-comment { padding: 3px 5px ; }
.article-content p{
margin-bottom:1em;
}
/*------------------------ #Generate End ------------------------ */
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;
}
/***************************************************/
* PIXNET blog template for Fahrenheit Blog Design Contest.
*
* Version: 1.1
* Author: Lee, Yim Chi
* Email: [email protected]
* Website: http://blog.pixnet.net/wannebe
***************************************************/
* {
padding: 0;
margin: 0;
} |
| |
|
整 個 樣 板 頁 面
|
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: small;﹝字體大小﹞
background: #FFF﹝背景顏色﹞
url(http://i390.photobucket.com/albums/oo347/RuNm8v7/
blog%20background%20use/32x32-1.jpg)｛背景圖片﹝網址﹞｝
repeat top left;｛背景圖片﹝重複、置頂、靠左﹞｝
cursor:URL(http://www.geocities.jp/linda5437love/52linda0072.ani);｛滑鼠﹝網址1﹞｝
color: #444;
}
a {
color: #657CFC;
text-decoration: none;
}
a:hover {
text-decoration: underline;｛滑鼠移至連結時﹝沒有底線﹞｝
cursor:url(http://sky.geocities.jp/lovetyhgf/1.cur);｛滑鼠﹝網址2﹞｝
}
|
| |
|
管 理 後 台﹝發表新文章、管理後台﹞
|
#authority {
background: url(http://link.photo.pchome.com.tw/s12/vevz09b/
30/126833441090/)｛背景圖片﹝網址﹞ ｝
no-repeat｛背景圖片﹝不重複﹞ ｝
bottom center;height: 38px;｛背景圖片﹝高度﹞ ｝
text-align: right;﹝文字靠右﹞
padding: 22px 190px 12px 20px;｛背景圖片﹝上、下、左、右﹞的距離｝
font-size: 20px;｛﹝字體大小﹞｝
}
#authority a {
color: #b51c4f;font-weight:bold;
margin-right: 10px;
} |
| |
|
所 有 內 容 區 塊
|
#container {
width: 980px;
margin: 15px auto 25px auto;
background-color: #FFF;
border: solid 1px #999;
}｛所有內容區塊1｝
#container2 {
margin: 0;
padding: 0;
}｛所有內容區塊2｝
#container3 {
margin: 0;
padding: 10px;
}｛所有內容區塊3｝ |
| |
|
橫 幅
|
#header {
position: relative;
width: 100%;
margin-bottom: 15px;
}｛上方﹝橫幅區塊﹞｝
#login-bar {
font-size: 80%;
text-align: right;
margin-bottom: 10px;
}｛上方﹝登入區塊﹞｝
#banner {
background: #FFF﹝背景顏色﹞
url(http://i390.photobucket.com/albums/oo347/RuNm8v7/
blog%20banner/yam/vevz09/-vevz09-Banner-1-1.jpg) ｛背景圖片﹝網址﹞｝
no-repeat top left; ｛背景圖片﹝不重複、置頂、靠左﹞｝
height: 620px;｛背景圖片﹝高度﹞｝
padding: 15px 20px;｛背景圖片 - 距離整個橫幅區塊的﹝上、下、左、右﹞的距離｝
}
#banner h1 {
font-size: xx-large; ﹝字體大小﹞
font-style: italic; ﹝字體風格﹞
font-family: "Simhei", sans-serif; ﹝字型﹞
font-weight: 800; ﹝標題區塊寬度﹞
}｛網誌標題﹝字體大小、字型、風格、標題區塊寬度﹞｝
#banner h1 a, #banner h1 a:hover {
color: #6600FF;﹝連結字體顏色﹞
text-decoration: none;﹝刪除連結底線﹞
}｛網誌標題﹝連結狀態﹞｝
#banner h2 {
color: #0066FF;﹝字體顏色﹞
padding: 16px 0px; ﹝網誌描述的位置﹞
font-size: 16px; ﹝字體大小﹞
WIDTH: 420px; ﹝網誌描述區塊的寬度﹞
letter-spacing : 3pt; ﹝每個字之間的距離﹞
BACKGROUND-IMAGE: url(http://link.photo.pchome.com.tw/
s12/vevz09b/24/126833956229/); ﹝網誌描述區塊的背景圖片網址﹞
}｛網誌描述﹝字體顏色、大小、字型、風格、標題區塊寬度、背景圖片﹞｝
|
| |
|
跳 到 主 文
|
.skiplink {
position: absolute;
top: 0;
left: 0;
font-size: 80%;
}
|
| |
|
部 落 格 - 全 站 分 類
|
#blog-category {
position: absolute;
bottom: 5px;
right: 10px;
font-size: 80%;
color: #FFF;
}
#blog-category a {
color: #990202;
}﹝字體顏色﹞
#blog-category a:hover {
color: #E6BE20;﹝連結字體顏色﹞
} |
| |
|
其 他 服 務 業 面 導 覽
|
#navigation {
position: absolute;
left: 0;
bottom: 30px;
float: left;
width: 930px;
background: #000 url(http://00000000.gif) repeat-x left top;
padding: 2px 15px;font-size:20px;letter-spacing : 5pt;
}｛橫幅下方的四個主要頻道﹝相簿、部落格、留言、名片﹞｝
#navigation li {
float: left;
margin-right: 15px;
}
#navigation li a {
float: left;
display: block;
padding: 8px 15px;
color: #FFF;
font-weight: 700;
}
#navigation li a:hover {
color: #E6BE20;
text-decoration: none;
}
#navigation #link-album a {
background: url(http://pic.pimg.tw/wannebe/1199061866.gif) no-repeat left center;
padding-left: 123px;
}｛橫幅下方的四個主要頻道﹝相簿未連結時的背景圖片﹞｝
#navigation #link-album a:hover {
background: url(http://pic.pimg.tw/wannebe/1199061867.gif) no-repeat left center;
}｛橫幅下方的四個主要頻道﹝相簿連結時的背景圖片﹞｝
#navigation #link-blog a {
background: url(http://pic.pimg.tw/wannebe/1199062480.gif) no-repeat left center;
padding-left: 86px;
}｛橫幅下方的四個主要頻道﹝部落格未連結時的背景圖片﹞｝
#navigation #link-blog a:hover {
background: url(http://pic.pimg.tw/wannebe/1199062481.gif) no-repeat left center;
}｛橫幅下方的四個主要頻道﹝部落格連結時的背景圖片﹞｝
#navigation #link-guestbook a {
background: url(http://pic.pimg.tw/wannebe/1199063111.gif) no-repeat left center;
padding-left: 187px;
}｛橫幅下方的四個主要頻道﹝留言板未連結時的背景圖片﹞｝
#navigation #link-guestbook a:hover {
background: url(http://pic.pimg.tw/wannebe/1199063125.gif) no-repeat left center;
}｛橫幅下方的四個主要頻道﹝留言板連結時的背景圖片﹞｝
#navigation #link-profile a {
background: url(http://pic.pimg.tw/wannebe/1199062484.gif) no-repeat left center;
padding-left: 133px;
}｛橫幅下方的四個主要頻道﹝版主名片未連結時的背景圖片﹞｝
#navigation #link-profile a:hover {
background: url(http://pic.pimg.tw/wannebe/1199062485.gif) no-repeat left center;
}｛橫幅下方的四個主要頻道﹝版主名片連結時的背景圖片﹞｝｝ |
| |
| |
#main {
clear: both;
width: 960px;
padding: 0 0 10px 0;
margin: 0;
float: left;
}
#content {
width: 650px;
float: left;
padding: 0;
margin: 0 50px 0 0;
}
|
| |
|
文 章 內 容 區
|
.article-head a, .article-content a {
color: #990202;
}
.article-content a:hover {
color: #E6BE20;
}
#article-area, #article-box {
margin: 0;
padding: 0;
float: left;
width: 650px;
}
.article {
padding: 0;
margin-bottom: 30px;
clear: both;
float: left;
width: 650px;
}
.article-head .publish {
font-size: 70%;
text-align: right;
margin-bottom: 3px;
padding: 0;
color: #666;
}
.article-head .title h2, h3.article-area-title｛﹝文章標題﹞｝ {
font-size: 120%;
font-weight: bold;
margin-bottom: 10px;
background: url(http://link.photo.pchome.com.tw/s12/
vevz09b/30/126832959941/) ｛文章標題﹝標題圖框﹞｝
no-repeat left center;｛標題圖框﹝不重複、靠左﹞｝
padding: 0 0 0 56px;
border-bottom: solid 0px #b51c4f;
margin-bottom:20px;letter-spacing : 1pt;
padding:56px;
}｛標題圖框﹝整體位置﹞｝
.article-body {
margin-bottom: 5px;
}｛標題圖框﹝整體位置﹞｝
.article-body .author {
font-size: 90%;
text-align: right;
color: #666;background:url() left top repeat;
}
.article-footer {
float: left;
text-align: right;
font-size: 80%;
color: #666;
width: 100%;background:url(http://i390.photobucket.com/albums/oo347/RuNm8v7/blog%20background%20use/10-02-01-012.png) left top repeat; border-bottom: solid 6px #b51c4f;
}｛文章﹝附加資訊﹞｝
.article-footer .refer {
float: left;
}｛文章分類﹝分類資料夾﹞｝
.article-footer .refer li {
float: left;
margin-right: 15px;
}｛文章分類資料夾﹝個人分類﹞｝
.article-footer .back-to-top {
float: right;
}
#user-post {
clear: both;
}｛﹝文章回應區塊﹞｝
#trackback-box {
margin-bottom: 15px;
}｛﹝回到首頁﹞｝
#trackback-box h3, #comment-box h3 {
font-weight: bold;
margin-bottom: 10px;
}｛﹝留下回響﹞｝
.page {
clear: both;
margin: 10px 0 0 0;
text-align: center;
} |
| |
| |
#content .main-list, #content .main-list table {
width: 100%;
}
#content .main-list th {
background-color: #DDD;
font-weight: bold;
padding: 5px 10px;
}
#content .main-list td {
padding: 3px 10px;
border-bottom: solid 1px #DDD;
} |
| |
| |
#links {
width: 250px;
display: inline;
float: right;
}
|
| |
|
側 邊 欄 位｛含﹝自由欄位﹞｝
|
.box {
margin-bottom: 20px;
border-bottom: solid 5px #b51c4f;
padding-bottom: 10px;
clear: both;
width: 250px;
}
.box-title{color: #b51c4f; ﹝側邊欄位標題 - 標題文字顏色﹞
background:url(http://link.photo.pchome.com.tw/s12/
vevz09b/30/126833114597/) ﹝側邊欄位標題圖框﹞
no-repeat;﹝側邊欄位標題圖框 - 不重複﹞
text-align:left;﹝側邊欄位標題圖框 - 靠左﹞
height:55px;﹝側邊欄位標題圖框 - 高度﹞
font-size:medium;letter-spacing : 2pt;﹝側邊欄位標題 - 標題文字大小、每個字之間的距離﹞
font-weight:700;﹝側邊欄位標題圖框 - 整體寬度﹞
padding:26px 0 0 56px;﹝側邊欄位標題圖框 - 位置與距離﹞
}
.box-text {
padding: 0 10px;
}﹝側邊欄位每一小區塊文字 - 位置與距離﹞
.box .inner-box {
margin-bottom: 10px;
}
.box-more {
clear: both;
font-size: 80%;
text-align: right;
}﹝側邊欄位 - 文章分類區塊 - 開合按鈕 - 位置與距離﹞
|
| |
|
文 章 繼 續 閱 讀
|
.more {
text-align:right;
background:#fff ﹝文章繼續閱讀 - 背景顏色﹞
url(http://i390.photobucket.com/albums/oo347/RuNm8v7
/blog%20guestbook%20use/t_09.gif) ﹝文章繼續閱讀 - 前方動態圖片﹞
no-repeat;﹝文章繼續閱讀 - 前方動態圖片 - 不重複﹞
padding-right:508px;
}﹝文章繼續閱讀 - 整體寬度﹞
|
| |
|
月 曆
|
#links #calendar table {
width: 100%;
}﹝月曆﹞
#links #calendar th, #links #calendar tr {
text-align: center;
}
#links #calendar .month-nav th, #links #calendar .month-nav a {
color: #E6BE20;
font-weight: bold;
}﹝月曆 - 月份的文字設定﹞
#links #calendar .weekday th {
font-weight: bold;
}﹝月曆 - 星期的文字設定﹞
#links #calendar .today, #link #calendar .today a {
color: #990202;
font-weight: bold;
}﹝月曆 - 日子的文字設定﹞
|
| |
|
碎 碎 念
|
#links #murmur .murmur-time {
font-size: 75%;
color: #666;
}﹝碎碎念的時間 - 文字大小、顏色、設定﹞
#links #mylink ul {
margin-left: 10px;
}﹝碎碎念的連結與位置設定﹞ |
| |
| |
#links #crumb li, #links #crumb li a {
display: block;
} |
| |
| |
#footer {
clear: both;
width: 100%;
border-top: dashed 1px #999;
padding-top: 10px;
margin-top: 10px;
font-size: 90%;
text-align: center;
}
#footer a {
color: #999;
} |
| |
|
迴 響 整 體 區 塊
|
.post-comment{
font-size: 0pt;
MARGIN: 10px 0px 10px 10px;
height:40px;
TEXT-ALIGN: RIGHT;
} |
| |
| 我 要 留 言 或 迴 響 |
.post-comment a{
DISPLAY: block;
BACKGROUND: url(http://p5.p.pixnet.net/albums/userpics/5/8/29758/1195056268.jpg) no-repeat 0px 0px ; WIDTH: 300px; height:40px;
font-size: 0px;
} |
| |
| 背 景 圖 片 與 區 塊 的 大 小 |
TEXTAREA
{
BORDER-RIGHT: rgb(153,153,153) 1px solid; BORDER-TOP: rgb(153,153,153) 1px solid; FONT-SIZE: 16px;letter-spacing : 3pt;font-weight:bold; BACKGROUND-IMAGE: url(http://link.photo.pchome.com.tw/s12/vevz09b/24/126833771323/); BORDER-LEFT: rgb(153,153,153) 1px solid; WIDTH: 370px; COLOR: #000000; BORDER-BOTTOM: rgb(153,153,153) 1px solid; BACKGROUND-REPEAT: repeat; FONT-FAMILY: Arial,sans-serif; HEIGHT: 369px;WIDTH: 536px;
} |
| |
訪 客 迴 響 -
文 字﹝大 小、顏 色、字 型﹞設 定 |
li.post-text
{
FONT-SIZE: 16px;letter-spacing : 3pt;font-weight:bold;line-height : 200%;color : #00CC00;
} |
| |
版 主 回 覆 迴 響 -
文 字﹝大 小、顏 色、字 型﹞設 定 |
li.reply-text
{
FONT-SIZE: 16px;letter-spacing : 3pt;font-weight:bold;line-height : 200%;color : #6600FF;
} |
| |
|
｛﹝備 註﹞｝
|
| 如 果 您 的 CSS 裡 面 |
| 找 不 到 上 敘 的 其 中 幾 個 語 法 |
| 請 自 行 複製語法 並 在 您 的 CSS 最 下 方 |
| 然 後 按 下 鍵 盤 上 的 Enter 鍵｛空出位置｝ |
| 然 後 在 空 出 的 位 置 處｛貼上語法｝ |
|
|
| |
| |
