Posted: 2004/11月/16 1:15下午 | IP記錄
|
|
|
在HTML標識符中加入Styles
你可以為幾乎所有的HTML標識符提供規則。例如,假設你想讓處於一個列表中的所有文字以紅色顯示出來,你就可以用下面的規則來 實現這一點:
<HTML>
<HEAD>
<TITLE> Simple Style </TITLE>
<STYLE>
<!--
B {color: red}
OL {color: red}
-- >
</STYLE>
</HEAD>
<BODY>
<B> I am bold and red </B>
<OL>
<LI> I am red.
<LI> So am I.
</OL>
</BODY>
</HTML>
在此例中,規則OL {color : red}作用於所有列出的表項顏色。如果你有多個列表,其餘列表中表項的顏色也會是紅色。
在此Style Sheets中的所有規則對它們所作用的元素都有相同的效果,第一個規則讓所有包含在<B>標識符中的文字以紅色顯 示出來,而第二個規則讓所有位於每個有序列表中的東西都以紅色顯示。要想節省代碼長度,你可以將這兩句合併為一句:
B,OL {color : red}
規則不僅僅能決定顏色這一屬性的行為,還對許多屬性起作用。例如,你可以建立一個規則來指定所有的頂部標題都應當以24個點大小 的Arial字體顯示出來,並且具有黃色背景(見圖7.19),如下所示:
<HTML>
<HEAD>
<TITLE> Simple Style </TITLE>
<STYLE>
<!--
H1 {font-style: italic; font-size: 24pt;
font-family: Arial; background: yellow}
-->
</STYLE>
</HEAD>
<BODY>
<H1> Important Information </H1>
This document contains very important information
</BODY>
</HTML>
圖7.19 具有多重屬性的規則
此例中的這個簡單規則對所有位於標題中的文字都起作用,這個規則的聲明中包含了許多屬性及其值,它們由分號分隔。通過這種方法, 你可以根據需要在一個聲明中加入許多屬性及其值。
你也可以為<P>和<BODY>標識符指定規則。當你想要控制大量文本的格式時,這是非常有用的,當你 為<BODY>標識符指定一個規則時,這條規則將會作用於所有包含在文件主體部分中的東西;當為<P> 指定一條規則時,它僅僅作用於包含在此標識符中的東西,如下所示:
<HTML>
<HEAD>
<TITLE> Simple Style </TITLE>
<STYLE>
<!--
BODY {font-size: 24pt}
P {font-style: italic}
-->
</STYLE>
</HEAD>
<BODY>
This text is above the paragraph.
<P> This text is inside the paragraph. </P>
</BODY>
</HTML>
當這個HTML文件在瀏覽器上顯示時,所有的文字將以24點大小的字體顯示出來(見圖7.20)。甚至位於<P>標 識符內部的文字也以24點大小的字體顯示,這是因為<P>標識符位於<BODY>標識符內部。然而,僅 僅位於<P>標識符內部的文字以斜體顯示出來。
圖7.20 為<BODY>和<P>使用的規則
當兩條規則衝突時會發生什麼呢?例如,假設在上例中為<P>標識符設定的規則指定文字以10點大小的字體顯示,在這 種情況下,在<P>標識符中指定的類型將會起作用。通常,為子元素設定的規則將會覆蓋為包含這個元素的父標識符所設 定的規則。
|