OECSPACE - Css style樣式表

CSS是Cascading Style Sheets的縮寫，我們中文稱為「串聯樣式表」

CSS串聯樣式表教學『連結屬性一覽』

a /*所有超連結*/
a:link /*超連結文字格式*/
a:visited /*瀏覽過的連結文字格式*/
a:active /*按下連結的格式*/
a:hover /*滑鼠移至連結*/
滑鼠游標樣式：
作業中 cursor:progress
十字型 cursor:crosshair
箭頭朝上 cursor:n-resize
箭頭朝下 cursor:s-resize
十字箭頭 cursor:move
箭頭朝右 cursor:e-resize
箭頭朝左 cursor:w-resize
加一問號 cursor:help
箭頭朝左上 cursor:nw-resize
箭頭斜右下 cursor:se-resize
文字I型 cursor:text
箭頭斜左下 cursor:sw-resize
箭頭朝右上 cursor:ne-resize
漏斗 cursor:wait
手型(IE6) cursor:pointer
無法使用(IE6) cursor:not-allowed
游標圖案(IE6) p {cursor:url("游標檔名.cur"),text;}

連結樣式範例

套用"文字屬性"來做超連結的效果
英文變大寫oecspace粗體,滑鼠移動過來看範例效果.按下去檢視語法

套用"邊框屬性"來做超連結的效果
用了下邊框滑鼠移動過來看範例效果,按下去檢視語法

連結樣式範例三之立體按鈕效果
按下去看範例效果和檢視語法

單純的文字連結，只用CSS就可以變成特別的立體按鈕
width: 2cm;/* 連結寬度範圍*/
代表連結文字的寬度範圍，就是說按鈕效果的大小
如果你不設定這行按鈕就會依你的連結文字多與少而變得不規則
複製下方語法於< head></head>之間
你就會看到網頁所有連結都會變成立體按鈕喔!

同一網頁設定不同滑鼠移到連結效果

一般用a:hover/*滑鼠移至連結*/只能讓網頁所有連結都引用這個動作
如何讓同一個網頁使用多個hover滑鼠移到連結的效果?往下看吧!!

多重連結效果：按此拷貝語法

滑鼠游標樣式可運用在任何標籤.例如:
整個網頁body{cursor:e-resize}
所有表格內table{cursor:e-resize}

使用圖案滑鼠游標例如:
body {cursor:url("mything.cur"),url("mything.cur"),text;}
當無法處理游標名單的第一個游標,則會以第二個游標代替
若無法處理任何定義的游標,最後便以一般游標text顯示 (圖案滑鼠游標寫法是W3C發佈的標準)
|X| 大部份常寫為 cursor:url(img/cur_f4.ani) 這是錯誤的