位置：首頁(yè) > 軟件操作教程 > 編程開發(fā) > CSS > 問(wèn)題詳情

CSS 集體選擇器

提問(wèn)人：劉團(tuán)圓發(fā)布時(shí)間：2020-11-17

    在編寫頁(yè)面的時(shí)候，會(huì)遇到很多個(gè)元素都要采用同一種樣式屬性的情況，這時(shí)會(huì)把這些樣式相同的元素放在一起進(jìn)行集體聲明，而不是單個(gè)分開來(lái)。這樣做可以極大地簡(jiǎn)化操作，集體選擇器就是為這種情況而設(shè)計(jì)的。

【例】使用集體選擇器

代碼如下：

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style>

li,.mytxt,span,a{

font-size: 20px;

color:red;

}

</style>

</head>

<body>

<ul>

<li>item1</li>

<li>item2</li>

<li>item3</li>

<li>item4</li>

</ul>

<hr/>

<p>這是第1行文字</p>

<p>這是第2行文字</p>

<p>這是第3行文字</p>

<p>這是第4行文字</p>

<p>這是第5行文字</p>

<hr/>

<span>這是span標(biāo)簽內(nèi)部的文字</span>

<hr/>

<a href="#">這是a標(biāo)簽內(nèi)部的文字</a>

</body>

</html>

    集體選擇器的語(yǔ)法是在每個(gè)選擇器之間使用逗號(hào)隔開。通過(guò)集體選擇器可以達(dá)到對(duì)多個(gè)元素進(jìn)行集體聲明的目的。以上代碼選中了頁(yè)面中所有的<li>、<span>、<a>以及類名為mytxt的元素，并且對(duì)這些元素進(jìn)行集體樣式的編寫。代碼運(yùn)行效果如圖所示。

image.png

繼續(xù)查找其他問(wèn)題的答案？

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