CSS(Cascading Style Sheets)是一種用于網(wǎng)頁(yè)樣式表的標(biāo)準(zhǔn)語(yǔ)言。在CSS中,樣式定義有很多種,下面介紹4種常用的樣式定義方式。
1. 內(nèi)聯(lián)樣式
<p style="color: red; font-size: 16px;">這是一個(gè)內(nèi)聯(lián)樣式的段落</p>
內(nèi)聯(lián)樣式是指將CSS樣式直接寫(xiě)在HTML標(biāo)簽的style屬性中,它的優(yōu)點(diǎn)是方便快捷,不需要單獨(dú)建立CSS文件,而缺點(diǎn)是不易于維護(hù)和修改。
2. 內(nèi)部樣式
<head> <style> p { color: red; font-size: 16px; } </style> </head> <body> <p>這是一個(gè)內(nèi)部樣式的段落</p> </body>
內(nèi)部樣式是指將樣式定義寫(xiě)在HTML文件的<head>標(biāo)簽中,使用<style>標(biāo)簽包裹。這種方式的優(yōu)點(diǎn)是可以在一個(gè)文件中統(tǒng)一定義多個(gè)HTML標(biāo)簽的樣式,缺點(diǎn)是不易于復(fù)用。
3. 外部樣式
<head> <link rel="stylesheet" href="style.css"> </head> <body> <p>這是一個(gè)外部樣式的段落</p> </body>
外部樣式是指將樣式定義寫(xiě)在獨(dú)立的CSS文件中,然后使用<link>標(biāo)簽將CSS文件與HTML文件連接起來(lái)。這種方式的優(yōu)點(diǎn)是可以在多個(gè)HTML文件中復(fù)用相同的CSS樣式,而且易于維護(hù)和修改。
4. 導(dǎo)入樣式
<head> <style> @import url("style.css"); </style> </head> <body> <p>這是一個(gè)導(dǎo)入樣式的段落</p> </body>
導(dǎo)入樣式和外部樣式類似,不同之處在于導(dǎo)入樣式使用CSS的@import規(guī)則將一個(gè)CSS文件引入到另一個(gè)CSS文件中。這種方式的優(yōu)缺點(diǎn)和外部樣式類似。