HTML屬性標(biāo)簽6
選擇符分為6種
1元素選擇符
當(dāng)頁面上多個(gè)元素的樣式相同時(shí),可以將多個(gè)元素放在一起定義,中間以逗號(hào)分開 例:td,p,li,input,select{font-size:12px;}
2class(類)選擇符
例:〈head>
<title>.....</title>
<style type="text/css">
<!--
.red{font-size:10.5pt;color:#ff0000}
-->
</style>
</head>
<body bgcolor="#ffffff">
<p>士大夫井岡山地方官</p>
<p>九連環(huán)離開計(jì)劃</p>
</body>
還有一種方法就是限定可以應(yīng)用它的頁面元素
例:〈head>
<title>.....</title>
<style type="text/css">
<!--
h1.red{color:#ff0000}
-->
</style>
</head>
<body bgcolor="#ffffff">
<p>士大夫井岡山地方官</p>
<h1>九連環(huán)離開計(jì)劃</h1>
</body>
3 id選擇符
與class選擇附類似,只是把'.'換成'#'
例:<body>
<head>
<style type="text/css">
<!--
#select{font-size:18px;color:#0000ff}
-->
</style>
</head>
<body>
<table width="250" border="1" height="50">
<tr>
<td id="select">id選擇符</td>
</tr>
</table>
</body>
</html>
我們看到在調(diào)用ID選擇附時(shí)與CLASS選擇附類似,只是將class=""換成了id="",方便頁面腳本語言的調(diào)用
關(guān)聯(lián)選擇符
<body>
<head>
<style type="text/css">
<!--
td p{font-size:18px;color:#0000ff}
-->
</style>
</head>
<body>
<table width="250" border="1" height="50">
<tr>
<td><p>關(guān)聯(lián)選擇符</p></td>
</tr>
</table>
<p>關(guān)聯(lián)選擇符</p>
</body>
</html>
我們?cè)O(shè)定了在元素中<td>的元素<p>所包含文字的樣式,只有在兩個(gè)條件都滿足是,樣式在會(huì)起作用,
偽類選擇符
是只能用在css選擇符里,而不能用在html代碼中的選擇符
例:
〈html>
<head>
<style type="text/css">
<!--
a:link{color:#000000}
a:visited{color:#cccccc}
a:hover{color:#ff0000}
a:active{color:#ooooff}
-->
</style>
</head>
<body>
<p><a href="#">關(guān)聯(lián)選擇符</a><p>
<p><a href="#">關(guān)聯(lián)選擇符</a><p>
<p><a href="#">關(guān)聯(lián)選擇符</a><p>
<p><a href="#">關(guān)聯(lián)選擇符</a><p>
〈/body>
</html>
正確的順序是a:link\a:visited\a:hover否則會(huì)引起頁面上連接顏色混亂
偽元素選擇符
與偽類選擇符定義類似,目前被大多數(shù)瀏覽器支持的有兩個(gè):首行偽元素(first-line)和首字符偽元素(first-letter)是用來實(shí)現(xiàn)首行大寫和首行下沉效果的
例:首行
<html>
<head>
<style>
<!--
p:first-line{color:red;font-size:20pt}
-->
</style>
</hesd>
<body>
<p>dfgsadfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdf...</p>
</body>
</html>
長(zhǎng)度隨瀏覽器窗口大小而改變
首字
<html>
<head>
<style>
<!--
p:first-letter{color:red;font-size:50pt;float:left;}
-->
</style>
</hesd>
<body>
<p>dfgsadfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdf...</p>
</body>
</html>
以上兩種都只能應(yīng)用于塊狀元素上
點(diǎn)擊加載更多評(píng)論>>