第一章　ＣＳＳ的基本認識

第一章　ＣＳＳ的基本認識

---

轉自:動態網製作指南 www.knowsky.com

關　於　Ｃ　Ｓ　Ｓ　的　概　論

　　ＣＳＳ是『Cascading Style Sheets』的簡稱，中文翻爲「串接樣式表」，也有人只翻爲「樣式表」。ＣＳＳ用以作爲網頁的排版與風格設計，在所謂的「新式網頁」裏 ，ＣＳＳ不容置疑是相當重要的一環。ＣＳＳ是以既有的基礎，用以彌補既存ＨＴＭＬ 規格里的不足，也讓網頁的設計更爲靈活。

　　這份教學文件就要來爲您介紹ＣＳＳ的應用羅！在這邊並不介紹ＣＳＳ的所有規格 ，僅就您在網頁寫作上較常用到，較可能用到的語法部份及應用的方法來爲您作介紹。也 由於現在兩瀏覽器的相容是漸行漸遠，將貼心地爲您註明支援該語法的瀏覽器。而ＩＥ從 3.0開始便支援部份語法了，這點也會爲爲您註明的。

各　章　節　的　概　略　介　紹

　　爲了您參考與學習上的方便，在這裏先爲您大略地說明一下這份教學文件各章節所包含的內容吧！讓您在參考時有個方向與概念。基本上，前兩章著重於概念與基本認知的建立，也就是一些爲您做一些札根的工作；第三章則爲您補充在應用與設定上的一些其它方式或特性的說明與介紹。而第四章到第六章則著重於語法、參數與性質的介紹，也 就是真正建立在樣式表裏面的東東。

第一章　ＣＳＳ的基本認識：

就是本章啦！就介紹您一些ＣＳＳ基本概念與認識。

第二章　ＣＳＳ的應用方式：

爲您介紹ＣＳＳ的基本宣告、應用方法與特性介紹。

第三章　ＣＳＳ的應用補充：

爲您介紹ＣＳＳ的其它宣告方式、應用與特性介紹。

第四章　頁面性質的ＣＳＳ：

爲您介紹頁面性質的ＣＳＳ相關語法、參數與性質。

第五章　文字性質的ＣＳＳ：

爲您介紹文字性質的ＣＳＳ相關語法、參數與性質。

第六章　區塊性質的ＣＳＳ：

爲您介紹區塊性質的ＣＳＳ相關語法、參數與性質。

應　用　上　的　基　本　認　識

　　應用ＣＳＳ並不困難，但是請您先參考這裏的基本認識，對一些用語有了一點基本概念後，對於您在看後面的教學會有助益，看起來也纔不會太吃力！

一、基本用語的認識：

元件(element)：亦即HTML基本語法中的標籤(tag)。
屬性(attribute)：用以描述標籤特性的屬性。
例如：

<HR WIDTH="90%">中，HR爲標籤，WIDTH爲屬性，而80%即爲WIDTH屬性的值。

性質(property)：用以描述元件的特性。相當於HTML基本 語法中的屬性。
樣式(style)：擁有一組或數組的性質，用以描述元件特性。
挑選者(selector)：套用樣式的元件。
例如：

H3{ COLOR : BLUE }中，H3爲挑選者，COLOR爲性質，BLUE爲COLOR性質的值。

二、基本單位的認識：
有相對單位與絕對單位兩種單位 表達方式。
相對單位：

『em』：相對於字母高度的比例因子。
『en』：相對於字型大小的比例因子。
『%』：相對於長度單位（通常是目前字型的大小）的百分比例。

絕對單位：

『in』：英寸。
『cm』：公分。
『mm』：公釐。
『px』：像素（系統預設單位）。
『pc』：pica，印刷活字單位。
『pt』：像點。

相對關係：1in= 6pc= 72pt= 2.54cm= 25.4mm

三、顏色使用的認識：

顏色的表示共有五種方式。
『#RRGGBB』：

以三個00到FF的十六進位值分別表示0到255十進位值的紅、綠、藍三原色數值。

『#RGB』：

簡略表示法，只用三個0到F的十六進位值分別表示紅、綠、藍三原色數值。而事實上，瀏覽器會自動擴展爲六個十六進位的值，如『#ABC』將變爲『#AABBCC』。但是，顯見這樣的 表示法並不精確。

『rgb(R,G,B)』：

以0到255十進位值的紅、綠、藍三原色數值來表示顏色。

『rgb(R%,G%,B%)』：

以紅、綠、藍彼此相對的數值比例來表示顏色，如『rgb(60%,100%,75%)』。

『Color_Name』：

直接以顏色名稱來表示顏色，共有141種標準的顏色名稱。

四、ＵＲＬ表示法的認識：

ＣＳＳ的ＵＲＬ表示共有五 種方式，且都爲合法宣告，您可以自行選用。
URL(http://yourweb/path/file_name)
URL('http://yourweb/path/file_name')
URL("http://yourweb/path/file_name")
URL( 'http://yourweb/path/file_name' )
URL( "http://yourweb/path/file_name" )

　　有了這些基本認識與概念後，接下來就要來爲您介紹ＣＳＳ的應用方法羅！