June 22,2005

CSS 的使用(一)

最近覺得網頁設計是越來越有趣了,特別是加強了 CSS 的應用.......

CSS (Cascading Style Sheets), 中文可以翻譯成「串接樣式表」。 經由CSS, 可以設定網頁整體的樣式,若是套用到整個網站,更可以方便日後樣式的修改!

主要有兩種設定方式,
1. 重新定義 HTML 標籤( Redefine HTML Tag )。 HTML 中的標籤都可以設定屬性,因此可以在 CSS 中定義標籤的屬性,網頁中只要是被該標籤定義的物件就會直接套用 CSS 的設定。

2. 自行定義 Clas 使用( Make Custom Style )。命名的方式是 .xxxx (Class 名稱),要記得先要有一個點,然後再加上自訂的 class 名稱,且最好避免將自訂的 class 名稱與 HTML 標籤名稱相同,以免造成自己的混淆。

而在 DreamWeave MX 中,還有一種進階的用法,預設是對超鏈結的各種狀態( a:link、a:visited、a:hover、a:active )做設定,當然您也可以對 HTML 標籤做進階的設定。

套用的方法,可以直接定義在一份 HTML文件的 HEAD 標籤中,使用此方式,套用範圍只限定在該 HTML 文件。另一種方式則是儲存成 .css 的檔案,以 link 方式連結至網頁中使用。如果網站中每個網頁都 link 該 CSS 檔案,則整個網站的網頁都可以套用該 CSS 的設定,網站整體的風格也由此定義出來了。

Posted by ch3128 at 樂多Roodo! │21:32 │回應(4)DreamWeaver 網頁設計
樂多分類:網路/3C 共同主題:網頁設計 工具:編輯本文
Ads by Roodo! 
回應文章
又發現一個說明很詳細的 CSS教學Blog - 網站製作學習誌

可以上去看看囉...

該文章的鏈結如下:
http://blog.roodo.com/jaceju/archives/91923.html
Posted by ch3128 at July 7,2005 16:06
一個介紹 CSS 的網站, 特別是該網站強調以無障礙閱讀為目標喔! 值得學習.

http://chinyi.ncit.edu.tw/~peterju/css.html
Posted by ch3128 at March 10,2006 10:25
學習果然是有幫助的,發現了一個好用的網址提供給大家。
撰寫好了的 CSS,該如何確認是否合乎規範?! 或者是有錯誤的地方呢?! W3C組織的網站上有提供工具可以自行檢測喔!

http://jigsaw.w3.org/css-validator/
Posted by ch3128 at April 20,2006 12:11
「自行定義 Clas 使用」← 少一個 s XD
Posted by 風痕影 at June 5,2008 15:03