CSS樣式表詳解

<!– Office 2003 風格 by 51dsn–>
<style type=”text/css”>
BODY
{
margin: 0px;
color: #333333;
background-color: #84BFE9;
background-color: #006699;<!– 網頁背景，網頁兩邊細豎色塊–>
font-family: Verdana, Arial, 宋體;<!– 字體–>
font-size: 9pt;<!– 字體大小–>
text-decoration: none;<!– 字體無下劃線，若改成有下劃線，改none為underline(下劃線）、overline（上劃線）、line-through（刪除線，即橫線通過字中部效果）–>
scrollbar-face-color: #377ED0; <!– 滾動條主體色，長塊和小塊的深藍色–>
scrollbar-shadow-color: #E5EEFD; <!– 陰影：內右下色–>
scrollbar-highlight-color: #E5EEFD; <!– 強光：內左上色–>
scrollbar-3dlight-color: #377ED0; <!– 3D光：外左上色–>
scrollbar-darkshadow-color: #377ED0;<!– 陰影：外右下色–>
scrollbar-track-color: #E5EEFD;<!– 軌道的淡藍色–>
scrollbar-arrow-color: #E5EEFD;<!– 箭頭的淡藍色–>
<!– 如有興趣的朋友還可設一條：scrollbar-base-color: #E5EEFD;（基礎色）–>
<!– 以上為右邊網頁滑動條效果，包含友情連接、留言欄目的滑動條–>
}
A {text-decoration: none;}<!– 連接無下劃線，若改成有下劃線，改none為underline(下劃線）、overline（上劃線）、line-through（刪除線，即橫線通過字中部效果）–>
A:link {color: #003399;}<!– 未訪問過的連接色–>
A:visited {color: #003399;}<!– 已經訪問過的連接色–>
A:hover {color: #ff9900;}<!– MOUSE指向的連接色–>
A:active {color: #ff9900;}<!– 已經激活的連接色–>
a.Channel:link {color: #ffffff;}
a.Channel:visited {color: #ffffff;}
a.Channel:hover {color: #ff9900;}
a.Channel:active {color: #ff9900;}
<!– 以上為頻道連接字體色，主參照前文修改–>
TD
{
color: #333333;
font-family: Verdana, Arial, 宋體;
font-size: 9pt;
line-height: 150%;
}<!– 以上為所有單元格設置，可不用修改–>
INPUT
{
font-family: Verdana, Arial, 宋體;<!– 輸入區字體設置–>
font-size: 9pt;<!– 輸入區字體大小設置–>
color: #0560A6;<!– 輸入區字體色設置（深藍色）–>
border: #7F9DB9 1px solid;<!– 輸入區邊框色設置（藍灰色）–>
height: 20px;<!– 輸入區高度設置–>
}<!– 以上為表單輸入區設置–>
BUTTON
{
font-family: Verdana, Arial, 宋體;
font-size: 9pt;
color: #0560A6;<!– 字體色–>
background-color: #fafafa;<!– 按鈕背景色–>
border: #7F9DB9 1px solid;<!– 邊框色–>
height: 20px;<!– 高度–>
}<!– 以上為按鈕設置–>
SELECT
{
font-family: Verdana, Arial, 宋體;
font-size: 9pt;
color: #0560A6;
border: #7F9DB9 1px solid;
height: 20px;
}<!– 以上為下拉菜單設置–>
TEXTAREA
{
font-family: Verdana, Arial, 宋體;
font-size: 9pt;
color: #0560A6;
border: #7F9DB9 1px solid;
}<!– 以上文本輸入區屬性設置–>
.border
{
background-color: #CEDEFA;<!– 以上為左邊淺藍色–>
border-right: #bbbbbb 1px solid;<!– 為左邊右方豎下來線條色設置–>
}<!– 以上為左邊屬性設置–>
.border2
{
background-color: #E4EEFD;
border: #ff9900 1px solid;
padding: 0px 6px;<!– 間隙（四個全出現順序為頂部間隙、右側間隙、底部間隙、左側間隙；出現一個，則四個間隙都是這樣設置；出現兩個以上，按順序設置）–>
}<!– 欄目子頁相關設置，如搜索單元格，文章列表格等–>
.title_txt
{

}
.title
{

}
.tdbg
{

}
.pic1
{
border: #ff9900 1px solid;<!– 熱門圖片黃色邊框，若不顯示，改1為0–>
padding: 6px;<!– 間隙–>
}
.txt_css
{
background-color: #409EDE;
background-image: url(Skin/51dsn03/top_pathbg1.jpg);<!– 您現在所在的位置背景圖片–>
background-repeat: repeat-y;
padding: 2px 8px;<!– 間隙–>
border-bottom: #bbbbbb 2px solid;<!– 您現在所在的位置下邊灰色線–>
}
.title_lefttxt
{

}
.title_left
{
background-color: #FDDB94;
background-image: url(Skin/51dsn03/title_bg1.gif);<!– 左邊黃色背景圖片–>
background-repeat: repeat-x;
border: #7DABE1 1px solid;<!– 左邊黃色背景圖片的邊框色–>
padding: 0px 6px;<!– 間隙–>
color: #333333;<!– 以上為左邊圖片上的字體色–>
font-weight: bold;<!– 字體加粗–>
}
.tdbg_left
{
padding: 6px;<!– 間隙–>
}
.title_left2
{

}
.tdbg_left2
{

}
.tdbg_leftall
{
border-bottom: #ffffff 1px solid;<!– 左邊那條難看的白線，應改1為0就沒有了–>
padding: 6px;<!– 間隙–>
}
.title_maintxt
{

}
.title_main
{
color: #ffffff;
font-weight: bold;
text-align: right;<!– 文本居右–>
background-image: url(Skin/51dsn03/title_m1.jpg);<!– 淺藍色圖片–>
background-repeat: no-repeat;
background-position: right;<!– 背景圖片居右–>
border-bottom: #bbbbbb 1px solid;<!– 首頁最新文章欄單元格下邊灰線–>
padding: 2px 6px;<!– 間隙–>
}<!– 淺藍色圖片，如首頁最新文章欄單元格–>
.tdbg_main
{
background-color: #fafafa;<!– 背景色–>
border-bottom: #bbbbbb 1px solid;<!– 底部灰色線，改1為0，則無底線–>
padding: 6px;<!– 間隙–>
}<!– 以上為最新文章列表、最新論壇論新貼、最新留言、圖片更新、文章頻道的最新推薦最新熱門等列表設置–>
.title_main2
{
color: #ffffff;
font-weight: bold;
text-align: right;
background-image: url(Skin/51dsn03/title_m2.jpg);
background-repeat: no-repeat;
background-position: right;
border-bottom: #bbbbbb 1px solid;
padding: 2px 6px;
}<!– 橙黃色圖片設置，如首頁論壇新貼、下載更新（其它設置見.title_main）–>
.tdbg_main2
{
color: #ffffff;
font-weight: bold;
text-align: right;
background-image: url(Skin/51dsn03/title_m3.jpg);
background-repeat: no-repeat;
background-position: right;
border-bottom: #bbbbbb 1px solid;
padding: 2px 6px;<!– 間隙–>
}<!– 綠色圖片設置，如首頁圖片更新、最新留言（其它設置見.title_main）–>
.tdbg_mainall
{
padding: 6px;<!– 間隙–>
}
.title_righttxt
{

}
.title_right
{
background-image: url(Skin/51dsn03/title_r1.gif);<!– 圖片位置–>
background-repeat: no-repeat;
border-right: #cccccc 1px solid;<!– 單元格右 邊線–>
padding: 0px 6px;<!– 間隙–>
height: 23px;<!– 單元格高度–>
}<!– 各頁欄目標題欄設置，就是那個左上圓角圖片單元格設置–>
.tdbg_right
{
border-left: #cccccc 1px solid;<!– 單元格左 邊線–>
border-right: #cccccc 1px solid;<!– 單元格右 邊線–>
border-bottom: #cccccc 1px solid;<!– 單元格底 邊線–>
padding: 6px;<!– 間隙–>
}
.title_right2
{
background-color: #C3DAF9;
background-image: url(Skin/51dsn03/title_bg2.gif);
background-repeat: repeat-x;
border: #cccccc 1px solid;
padding: 0px 6px;<!– 間隙–>
height: 23px;
}
.tdbg_right2
{
background-color: #fafafa;
border-left: #cccccc 1px solid;
border-right: #cccccc 1px solid;
border-bottom: #cccccc 1px solid;
padding: 6px;<!– 間隙–>
}
.tdbg_rightall
{

}
.topborder
{

}
.nav_top
{
background-color: #377ED0;
background-image: url(Skin/51dsn03/top_channelbg1.jpg);<!– 頂部頻道背景圖片位置–>
background-repeat: repeat-y;
padding: 2px 8px;<!– 間隙–>
color: #ffffff;
text-align: right;
}<!– 頂部頻道–>
.nav_main
{
background-color: #2C92DC;
background-image: url(Skin/51dsn03/top_main01.jpg);<!– 頂部BANNER位置–>
background-repeat: no-repeat;
height: 60px;<!– 高度–>
}<!– 頂部BANNER–>
.nav_bottom
{
background-color: #5197DD;
background-image: url(Skin/51dsn03/bottom_navbg1.jpg);<!– 底部背景圖片位置–>
background-repeat: repeat-y;
border-top: #bbbbbb 1px solid;<!– 底部上方的那條灰線–>
padding: 2px 8px;<!– 間隙–>
}<!– 底部設置–>
.nav_ann
{
border-top: #377ED0 2px solid;<!– 公告欄上邊深藍色線條–>
background-color: #BFD6F9;<!– 背景色–>
padding: 2px 8px;<!– 間隙–>
}<!– 公告欄設置–>
.nav_menu
{
background-color: #2C92DA;
background-image: url(Skin/51dsn03/top_menubg1.jpg);
background-repeat: repeat-y;
padding: 2px 8px;<!– 間隙–>
text-align: right;
}<!– 以上為頂部菜單–>