本系列的前面幾章都在介紹關於網頁設計的功能語法HTML,不過只有功能好像不足以成為一個完整的網站,最明顯的差異就像是以往我們看到的網頁都是有不同顏色的吧!
今天我們要來介紹的就是CSS,他就是專門用來把網頁上的東西呈現出來的。
CSS原名為Cascading Style Sheets,中文翻譯為層疊樣式表,前面有說到我們可以用他來做網頁樣式的設計,他是屬於樣式表語言。他不能單獨使用,必須搭配HTML或XML等結構化文件一起工作,分工上就是HTML決定網站的內容,CSS決定內容呈現的樣式排版等等的,CSS最重要的目標就是將檔案的內容與他的顯示分隔開來。
CSS主要由3個東西組成:
<p>
font-size: 60px;
color: black;
background: yellow;
</p>
這是我們針對<p></p>
標籤裡面的內容所做的設定,我們指定的<p>
標籤就是所謂的選擇器。
再看到標籤裡面夾的程式碼,靠前的font-size、color、background是屬性,屬性包含著像是顏色、字體大小、背景顏色等等的,只要接上冒號(:),後面就可以自行決定想要對該屬性設定的值。不過不同的屬性也有特定格式的值,就好比說,你總不能規定那一行字的大小是黃色的吧!完全不合邏輯是吧~
先稍微透漏一點點,就是CSS方便的地方在於,可以零星的對網頁做樣式設定,不是所有同樣標籤的內容都必須套用一樣的版式,例如我就想要網頁全部為黑色背景,只有中間那一塊是水藍色的,也是很容易做到的喔!
CSS其實也有很多自己的格式和功能,前面我們講過不少HTML的語法,接下來的文章也會和之前一樣,以CSS為主題一一為大家介紹!