位置:首頁 > 軟件操作教程 > 編程開發(fā) > HTML > 問題詳情

HTML屬性標簽6

提問人:劉團圓發(fā)布時間:2020-10-10

選擇符分為6

1元素選擇符

當頁面上多個元素的樣式相同時,可以將多個元素放在一起定義,中間以逗號分開 例: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)離開計劃</p>

</body>

還有一種方法就是限定可以應用它的頁面元素

例:〈head>

<title>.....</title>

<style type="text/css">

<!--

h1.red{color:#ff0000}

-->

</style>

</head>

<body bgcolor="#ffffff">

<p>士大夫井岡山地方官</p>

<h1>九連環(huán)離開計劃</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選擇附時與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>

我們設(shè)定了在元素中<td>的元素<p>所包含文字的樣式,只有在兩個條件都滿足是,樣式在會起作用,

偽類選擇符

是只能用在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否則會引起頁面上連接顏色混亂

偽元素選擇符

與偽類選擇符定義類似,目前被大多數(shù)瀏覽器支持的有兩個:首行偽元素(first-line)和首字符偽元素(first-letter)是用來實現(xiàn)首行大寫和首行下沉效果的

例:首行

<html>

<head>

<style>

<!--

p:first-line{color:red;font-size:20pt}

-->

</style>

</hesd>

<body>

<p>dfgsadfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdf...</p>

</body>

</html>

長度隨瀏覽器窗口大小而改變

首字

<html>

<head>

<style>

<!--

p:first-letter{color:red;font-size:50pt;float:left;}

-->

</style>

</hesd>

<body>

<p>dfgsadfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdf...</p>

</body>

</html>

以上兩種都只能應用于塊狀元素上

繼續(xù)查找其他問題的答案?

相關(guān)視頻回答
回復(0)
返回頂部