在網頁制作中,我們可以使用CSS來美化頁面。而CSS樣式表可以是外部引用,也可以是頁面內部引用。當我們在編寫一個頁面時,往往需要在不同的部分應用不同的CSS樣式,這時候我們就可以使用頁面局部引用CSS。
頁面局部引用CSS便是將CSS樣式表嵌入到HTML標記內,只在該標記下起作用,而不會影響到整個頁面的樣式。下面是一個例子:
<div class="box"> <h2 style="color: red;">標題</h2> <p style="font-size: 18px;">段落內容</p> <style type="text/css"> .box { border: 1px solid #ccc; padding: 10px; } h2 { font-size: 24px; font-weight: bold; text-align: center; } p { line-height: 1.5; text-indent: 2em; } </style> </div>
在上面的例子中,我們使用了<style>標記將CSS樣式表嵌入到了<div>標記中,這樣就只會對該標記下的h2和p標記生效。而box類名則是作用于該標記的樣式,這樣就使得該樣式只會作用于.box類名所在的標記。
值得注意的是,該方法雖然方便,但在樣式嵌入較多時,會增加HTML代碼量,增加維護難度。因此,建議在樣式代碼較多時,還是采用外部CSS樣式表引用的方式。