CSS選擇符說(shuō)明
更新時(shí)間:2007年03月25日 00:00:00 作者:
一、類型選擇符
body
{
font-size:12px;
}
{
color:blue;
}
指對(duì)網(wǎng)頁(yè)中已有的標(biāo)簽類型作為名稱的選擇符,如上表示:body標(biāo)簽內(nèi)的所有文字大小為12px;段落內(nèi)的文字顏色為藍(lán)色。
二、群組選擇符
h4,p,span
{
font-size:12px;
}
表示頁(yè)面所有的h4,p,span標(biāo)簽內(nèi)文字都為12px大小,即對(duì)一組對(duì)象進(jìn)行相同的樣式指定,每個(gè)標(biāo)簽之間用逗號(hào)分隔開(kāi)來(lái)。
三、包含選擇符
div p
{
font-weight:bold;
}
表示div標(biāo)簽里邊的p標(biāo)簽內(nèi)的文字為粗體字、這是一種包含關(guān)系,每個(gè)標(biāo)簽之間用空格隔開(kāi),可以為多級(jí)包含。
四、id和class選擇符
id是對(duì)頁(yè)面中的唯一元素進(jìn)行樣式定義,這個(gè)樣式在頁(yè)面中只使用一次、即id不重復(fù)
<div id="myDiv">
..
</div>
#myDiv
{
font-size:12px;
}
class定義的是通用或經(jīng)常使用的樣式,一種樣式在一個(gè)頁(yè)面中需要出現(xiàn)多次,即可以為不同的標(biāo)簽指定相同的class,如下表示:div和p標(biāo)簽內(nèi)的字體都是藍(lán)色
<div class="red">
</div>
<p class="red">..</p>
.red
{
color:blue;
}
五、組合選擇符
使用id或class,同時(shí)也使用標(biāo)簽來(lái)進(jìn)行組合
h1 #cont
{
}
表示id為cont的h1標(biāo)簽
h1 .cont
{
}
表示所有class為cont的h1標(biāo)簽
六、偽類選擇符
常見(jiàn)為a標(biāo)簽
a:link
{
}
a:hover
{
}
a:visited
{
}
七、通配選擇符
*
{
color:blue;
}
表示所有對(duì)象的字體都為藍(lán)色。
body
{
font-size:12px;
}
{
color:blue;
}
指對(duì)網(wǎng)頁(yè)中已有的標(biāo)簽類型作為名稱的選擇符,如上表示:body標(biāo)簽內(nèi)的所有文字大小為12px;段落內(nèi)的文字顏色為藍(lán)色。
二、群組選擇符
h4,p,span
{
font-size:12px;
}
表示頁(yè)面所有的h4,p,span標(biāo)簽內(nèi)文字都為12px大小,即對(duì)一組對(duì)象進(jìn)行相同的樣式指定,每個(gè)標(biāo)簽之間用逗號(hào)分隔開(kāi)來(lái)。
三、包含選擇符
div p
{
font-weight:bold;
}
表示div標(biāo)簽里邊的p標(biāo)簽內(nèi)的文字為粗體字、這是一種包含關(guān)系,每個(gè)標(biāo)簽之間用空格隔開(kāi),可以為多級(jí)包含。
四、id和class選擇符
id是對(duì)頁(yè)面中的唯一元素進(jìn)行樣式定義,這個(gè)樣式在頁(yè)面中只使用一次、即id不重復(fù)
<div id="myDiv">
..
</div>
#myDiv
{
font-size:12px;
}
class定義的是通用或經(jīng)常使用的樣式,一種樣式在一個(gè)頁(yè)面中需要出現(xiàn)多次,即可以為不同的標(biāo)簽指定相同的class,如下表示:div和p標(biāo)簽內(nèi)的字體都是藍(lán)色
<div class="red">
</div>
<p class="red">..</p>
.red
{
color:blue;
}
五、組合選擇符
使用id或class,同時(shí)也使用標(biāo)簽來(lái)進(jìn)行組合
h1 #cont
{
}
表示id為cont的h1標(biāo)簽
h1 .cont
{
}
表示所有class為cont的h1標(biāo)簽
六、偽類選擇符
常見(jiàn)為a標(biāo)簽
a:link
{
}
a:hover
{
}
a:visited
{
}
七、通配選擇符
*
{
color:blue;
}
表示所有對(duì)象的字體都為藍(lán)色。
相關(guān)文章
完美實(shí)現(xiàn)浮動(dòng)元素橫排居中顯示
本文給大家分享的是完美實(shí)現(xiàn)兼容各大瀏覽器的浮動(dòng)元素橫排居中顯示的代碼,十分的簡(jiǎn)單實(shí)用,有需要的小伙伴可以參考下。2015-06-06CSS網(wǎng)頁(yè)布局入門教程11:帶當(dāng)前標(biāo)識(shí)的標(biāo)簽式橫向?qū)Ш綀D片美化版
CSS網(wǎng)頁(yè)布局入門教程11:帶當(dāng)前標(biāo)識(shí)的標(biāo)簽式橫向?qū)Ш綀D片美化版...2007-09-09