?? 7-3-4.cfm.htm
字號:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>在HTML標識符的Class中加入Styles</title>
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
</head>
<body>
<font FACE="宋體"><b>
<p ALIGN="JUSTIFY">在HTML標識符的Class中加入Styles</p>
</b></font><font FACE="宋體" SIZE="3">
<p ALIGN="JUSTIFY">假設你想為網頁上特定的段落設定規則,而不是全部的內容。例如,你可能想讓網頁上的第一段以24點大小的字體顯示,而第二段則以14點的大小顯示,要利用Style
Sheets實現這一點,你必須找到一種方法來區別不同的<P>標識符。</p>
<p ALIGN="JUSTIFY">一個特殊的屬性專門為這一目的而被引入,每一個HTML標識符都有一CLASS屬性,它是用來將標識符分隔成不同的部分,下面的例子說明了如何使用這個屬性:</p>
<p ALIGN="JUSTIFY"><HTML><br>
<HEAD></p>
<p ALIGN="JUSTIFY"><TITLE> Style </TITLE></p>
<p ALIGN="JUSTIFY"><STYLE></p>
<p ALIGN="JUSTIFY"><!--</p>
<p ALIGN="JUSTIFY">P.TheFirstClass {font-size: 24pt}</p>
<p ALIGN="JUSTIFY">P.TheSecondClass {font-size: 14pt}</p>
<p ALIGN="JUSTIFY">--></p>
<p ALIGN="JUSTIFY"></STYLE></p>
<p ALIGN="JUSTIFY"></HEAD></p>
<p ALIGN="JUSTIFY"><BODY></p>
<p ALIGN="JUSTIFY"><P CLASS=“TheFirstClass”></p>
<p ALIGN="JUSTIFY">I am the first paragraph and I am formatted with a 24 point font.</p>
<p ALIGN="JUSTIFY"></P></p>
<p ALIGN="JUSTIFY"><P CLASS=“TheSecondClass”></p>
<p ALIGN="JUSTIFY">I am the second paragraph and I am formatted with a 14 point font.</p>
<p ALIGN="JUSTIFY"></P></p>
<p ALIGN="JUSTIFY"></BODY></p>
<p ALIGN="JUSTIFY"></HTML></p>
<p ALIGN="JUSTIFY">位于兩個<P>標識符之間的文字將以不同大小的字體顯示出來(見圖7.21)。這兩個段落分別由它們的CLASS屬性區別開來,例如,第一個段落與名為TheFirstClass的class相關聯,而第二個段落則與名為TheSecondClass的class相關聯。</p>
<p ALIGN="JUSTIFY"><img SRC="Image64.gif" tppabs="http://210.74.168.175/guide/asp/part7/Image64.gif" WIDTH="595" HEIGHT="412"></p>
<b>
<p ALIGN="CENTER">圖7.21 使用CLASS標識符</p>
</b>
<p ALIGN="JUSTIFY">當指定了這些規則后,它們就和特定的class相關聯。例如,第一個規則通過使用class選擇符P.TheFirstClass與第一個class:TheFirstClass相關聯。class選擇符可用來區別一個標識符中不同的class,第一個段落的格式由第一個規則決定,因為這條規則選擇了與class:TheFirstClass相關聯的所有<P>標識符。</p>
<p ALIGN="JUSTIFY">不只一個<P>標識符可成為同一個class的成員。例如,假設有第三個<P>標識符被添加進上述HTML文件中,并指定屬性CLASS=“TheFirstClass”,則處于這個新的<P>標識符中的文字也受第一條規則的控制,第一條規則將作用于所有具備屬性CLASS=“TheFirstClass”的段落中。</p>
</font>
</body>
</html>
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -