CSS語法公開(簡易篇)
1.固定背景。
2.游標換圖。
3.捲軸變色。
4.自訂欄位連結動畫。
5.文章標題前加圖片。
6.當滑鼠移到連結上時，無底線，字變紅色。
有說明css的網站連結:
1.固定背景
background-attachment:
fixed ．當拉動捲軸時，背景圖不會移動
scroll ．當拉動捲軸時，背景圖跟著移動(預設選項)
background-color:black．背景色，如沒有設定背景圖或背景圖不能顯示，背景顏色才出來
background-image:url(背景圖網址)．不用背景圖可刪除此列
background-repeat: repeat． 背景圖自動複制並填滿整個網頁畫面，只適合有背景圖時，不用可改為no-repeat
background-attachment: fixed． 當拉動捲軸時，背景圖不會移動，只適合有背景圖時，不用可刪除此列
背景語法範例：(背景圖填滿整個頁面，而且拉動捲軸時，背景圖不會移動。)
body{
background-color:背景色;
background-image:url(背景圖網址);
background-repeat: repeat;
background-attachment: fixed;}
玄音測試版的固定背景語法：800*600的解析度螢幕，自製背景大小為780*440即可。
在ＣＳＳ內容，找到下面這兩個項目語法，改一下網址跟固定值即可固定背景。
/*Background*/ （基本設定的背景圖改成自製的背景圖）
body{background:#000000 url(http://home.pchome.com.tw/good/zz14723/cloud/12-1.jpg ) no-repeat;}
/*Background image for whole page*/ （自選背景圖片）
body {background-image: url(http://home.pchome.com.tw/good/zz14723/cloud/12-1.jpg); background-repeat:repeat;background-attachment: fixed;} （背景固定值為fixed）
2.改變滑鼠指標
以下是一般直接貼入CSS語法的不同滑鼠指標效果
cursor:auto 文字I型
cursor:crosshair 十字型
cursor:default 箭頭
cursor:pointer 手指
cursor:e-resize 箭頭朝右
cursor:ne-resize 箭頭朝右上
cursor:nw-resize 箭頭朝左上
cursor:n-resize 箭頭朝上
cursor:se-resize 箭頭斜右下
cursor:sw-resize 箭頭斜左下
cursor:s-resize 箭頭朝下
cursor:w-resize 箭頭朝左
cursor:move 十字箭頭
cursor:text 文字I型
cursor:wait 漏斗
cursor:help 加一問號
-------------------------------------
改變滑鼠指標語法範例：（滑鼠指標是十字；指向連結時，會改為疑問指標）
body{cursor:crosshair}
a:hover{cursor:help}
覆製上面語法或套用不同指標效果，然後直接貼在ｃｓｓ底下就可以了。
IＥ 6 專用樣式---改變滑鼠指標為圖片
目前只能在 IE 6 中才能顯示正常（不過一般都看得見），滑鼠圖的製作方法要運用Microangelo軟件。
body 整個網頁
a:hover 指向連結時
改變滑鼠指標為圖片語法範例：語法直接加入ｃｓｓ最底端就可以了。
body{cursor:URL(http://homelf.kimo.com.tw/zz14723/cursor34.ani);}
a:hover{cursor:URL(http://homelf.kimo.com.tw/zz14723/cursor27.ani);}
注意：
游標副檔名需是：.ani(動畫圖片) 或 .cur(靜態圖片)
http://home.kimo.com.tw/a815182/ani/1_index.htm 滑鼠游標圖案素材
http://sheng.phy.nknu.edu.tw/wjs-13ani.htm 阿盛滑鼠游標圖素材
或者自己做游標圖：MicroAngelo 5 + 中文化程式 軟體下載
奇摩網頁可以上傳游標檔案圖。
3.捲軸變色
捲軸顏色生成器：http://hw-driver-bal.nctu.net:52833/pub/slime/teach/Bar.htm
html{
SCROLLBAR-FACE-COLOR: 色碼; /*設定軸面顏色*/
SCROLLBAR-HIGHLIGHT-COLOR:色碼; /*設定軸面三角左邊顏色*/
SCROLLBAR-SHADOW-COLOR: 色碼; /*設定軸面三角右邊顏色*/
SCROLLBAR-3DLIGHT-COLOR: 色碼; /*設定左立體邊顏色*/
SCROLLBAR-DARKSHADOW-COLOR: 色碼; /*設定右立體面顏色*/
SCROLLBAR-ARROW-COLOR: 色碼; /*設定箭頭的顏色*/
SCROLLBAR-TRACK-COLOR: 色碼; /*設定軸軌的顏色*/
}
捲軸變色語法範例：將語法直接貼在CSS最底端即可。
html{
SCROLLBAR-FACE-COLOR: #000000;
SCROLLBAR-HIGHLIGHT-COLOR: #6c48d8;
SCROLLBAR-SHADOW-COLOR: #0048fc;
SCROLLBAR-3DLIGHT-COLOR: #000000;
SCROLLBAR-ARROW-COLOR: #d8b4d8;
SCROLLBAR-TRACK-COLOR: #000048;
SCROLLBAR-DARKSHADOW-COLOR: #6cd800;
SCROLLBAR-BASE-COLOR: #480090
}
4.自訂欄位連結動畫。
點入自訂欄位，填上自訂欄位名稱，之後在自訂欄位內容貼上語法，不管是貼圖語法或連結語法就可以了。
5.文章標題前加圖片。
文章標題前面加圖片：（※小圖片大小最好在W31*H20以內）
小圖示、icon素材網站：http://a120.loxa.edu.tw/material/icon_01.htm
/*article content module*/
.yblogcnt .blgtitlebar {margin-bottom:12px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:126%;font-weight:bold;background:url(圖片網址) no-repeat;padding-left:32px;}
.yblogcnt .blgtitlebar h2 a {color:#標題字顏色; padding-right:5px;}
語法範例：(文章標題前面加圖片)
覆製下列語法，直接貼在ＣＳＳ底端即可。
/*article content module*/
.yblogcnt .blgtitlebar {margin-bottom:12px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:126%;font-weight:bold;background:url(http://tw.yimg.com/i/tw/blog/smiley/39.gif) no-repeat;padding-left:32px;}
.yblogcnt .blgtitlebar h2 a {color:#FFFFFF; padding-right:5px;}
※網址及標題字色碼可自行更換。
6.當滑鼠移到連結上時，無底線，字變紅色。
a: {font-family:"Comic Sans MS";font-size:10pt;color:色碼;font-weight:bold;text-decoration:none} - 所有超連結
a:active {font-size:10pt;color:色碼;text-decoration:none} - 執行中的連結
a:link {font-size:10pt;color:色碼;text-decoration:none} - 正常的連結
a:visited {font-size:10pt;color:色碼;text-decoration:none} - 參觀過的連結
a:hover {font-size:110pt;color:色碼;position:relative;top:2px;left:2px;} - 當滑鼠移到連結上的時候
---------------------------------------------------------------------------------
font-size:10pt - 字體大小，只需要更改10pt，如12pt就可以改變字體大小
如 : font-size:12pt
text-decoration : none - 連結無底線，任選以下語法，將 none 更改就可以了
none(連結無底線)、underline(連結加底線)、overline(連結加頂線)、linethrough(連結加刪除線)、blink(連結閃爍)
如 :text-decoration : blink (連結閃爍)
-------------------------------------------------------------------------
語法範例：將下面語法覆製，貼在 /*Links*/ 下面（覆蓋原先的設定）
a: {font-family:"Comic Sans MS";font-size:10pt;color:FFFFFF;font-weight:bold;text-decoration:none}
a,a:link,a:visited{color:#FFFFFF;}
a:hover {font-size:10pt;color:RED;text-decoration : NONE}
※色碼可以自行更改，寫英文的顏色也可以。
a:link→正常連結顏色
a:hover→游標滑過時變色
以上就是我列出的ＣＳＳ語法說明，祝福您玩的愉快。
