css (Cascading Style Sheets),層疊樣式表，為html標(biāo)記語(yǔ)言提供了一種樣式描述，定義了其中元素的顯示方式。用于控制Web頁(yè)面的外觀。通過(guò)使用 css 實(shí)現(xiàn)頁(yè)面的內(nèi)容與表現(xiàn)形式分離，極大提高了工作效率 。樣式存儲(chǔ)在樣式表中，通常放在 <head> 部分或存儲(chǔ)在 外部 CSS 文件中。作為網(wǎng)頁(yè)標(biāo)準(zhǔn)化設(shè)計(jì)的趨勢(shì)，CSS 取得了瀏覽器廠商的廣泛支持，正越來(lái)越多的被應(yīng)用到網(wǎng)頁(yè)設(shè)計(jì)中去。 網(wǎng)頁(yè)現(xiàn)在的新標(biāo)準(zhǔn)是 W3C 。目前的模式是 html + Css + JavaScript ，如何理解呢，就是 Html 是網(wǎng)頁(yè)的結(jié)構(gòu)，CSS 是網(wǎng)頁(yè)的樣式，JavaScript是行為。結(jié)構(gòu)就是蓋房子先要把結(jié)構(gòu)建出來(lái)，然后用 CSS 來(lái)裝飾。其實(shí)你在用 Dreamweaver 做網(wǎng)頁(yè)時(shí)就已經(jīng)用到了 CSS，比如你用 DW 的屬性面板來(lái)設(shè)置一個(gè)字的字體、顏色和大小，當(dāng)你選好后，就會(huì)自動(dòng)生成一個(gè) .style1 的紅色代碼，在 <style></style> 之間不知道你注意過(guò)沒(méi)有，這就是 CSS。 如何使用 CSSCSS 是在 HTML 4 開(kāi)始使用的,是為了更好的渲染 HTML 元素而引入的. CSS 可以通過(guò)以下方式添加到 HTML 中:
最好的方式是通過(guò)外部引用 CSS 文件 內(nèi)聯(lián)樣式當(dāng)特殊的樣式需要應(yīng)用到個(gè)別元素時(shí)，就可以使用內(nèi)聯(lián)樣式，你可以在 <head> 部分通過(guò) <style> 標(biāo)簽定義內(nèi)部樣式表。 使用內(nèi)聯(lián)樣式的方法是在相關(guān)的標(biāo)簽中使用樣式屬性。樣式屬性可以包含任何 CSS 屬性。以下實(shí)例顯示出如何改變段落的顏色。 實(shí)例<head>
<style type="text/css">
body {background-color:yellow;}
p {color:blue;}
</style>
</head>HTML樣式實(shí)例 - 背景顏色背景色屬性（background-color）定義一個(gè)元素的背景顏色： <!DOCTYPE html> <html> <body> <h2>This is a heading</h2> <p>This is a paragraph.</p> </body> </html> 早期背景色屬性（background-color）是使用 bgcolor 屬性定義。 HTML 樣式實(shí)例 - 字體,字體顏色 ，字體大小我們可以使用 font-family（字體），color（顏色），和 font-size（字體大小）屬性來(lái)定義字體的樣式: 實(shí)例<!DOCTYPE html> <html> <body> <h1>A heading</h1> <p>A paragraph.</p> </body> </html> 現(xiàn)在通常使用 font-family（字體），color（顏色），和 font-size（字體大小）屬性來(lái)定義文本樣式，而不是使用 <font> 標(biāo)簽。 HTML 樣式實(shí)例 - 文本對(duì)齊方式使用 text-align（文字對(duì)齊）屬性指定文本的水平與垂直對(duì)齊方式： 實(shí)例<!DOCTYPE html> <html> <body> <h1>Center-aligned heading</h1> <p>This is a paragraph.</p> </body> </html> 文本對(duì)齊屬性 text-align 取代了舊標(biāo)簽 <center> 。 內(nèi)部樣式表當(dāng)單個(gè)文件需要特別樣式時(shí)，就可以使用內(nèi)部樣式表。你可以在 <head> 部分通過(guò) <style> 標(biāo)簽定義內(nèi)部樣式表: 實(shí)例<head>
<style type="text/css">
body {background-color:yellow;}
p {color:blue;}
</style>
</head>外部樣式表當(dāng)樣式需要被應(yīng)用到很多頁(yè)面的時(shí)候，外部樣式表將是理想的選擇。使用外部樣式表，你就可以通過(guò)更改一個(gè)文件來(lái)改變整個(gè)站點(diǎn)的外觀。 <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> 已棄用的標(biāo)簽和屬性在 HTML 4,原來(lái)支持定義 HTML 元素樣式的標(biāo)簽和屬性已被棄用。這些標(biāo)簽將不支持新版本的 HTML 標(biāo)簽。 不建議使用的標(biāo)簽有: <font>,<center>,<strike> 不建議使用的屬性: color 和 bgcolor. |
