html中css三種常見的樣式選擇器
發(fā)布時(shí)間:2013-07-19 15:27:26 作者:佚名
我要評論

這篇文章主要介紹了html中css的使用方法,一般用class與id實(shí)現(xiàn)樣式的控制,不過jquery可以更好的控制,也是當(dāng)前比較流行的js框架,推薦大家學(xué)習(xí)
1:標(biāo)簽選擇器
標(biāo)簽選擇器,是所有帶有某種標(biāo)簽的都生效。這里以p為例,也就是所有的帶有p標(biāo)記的都會這樣的樣式
復(fù)制代碼
代碼如下:<html>
<head>
<styletype="text/css">
p{font:"宋體"; color:#FF0000}
</style>
</head>
<body>
<pid="p1">我現(xiàn)在表現(xiàn)的是標(biāo)簽選擇器</p>
<pid="p2">我也用的是標(biāo)簽選擇器</p>
<h1>我沒有被任何的選擇器修飾</h1>
</body>
</html>
2:id選擇器,注意id選擇器是唯一的,因?yàn)橹挥衖d="yy"的才有這種樣式,而一個頁面里元素的Id必須是唯一的,所以。。。你懂得id選擇器以#開頭用法是:id=""
復(fù)制代碼
代碼如下:<html>
<head>
<styletype="text/css">
#yy{font:"宋體"; color:#FF0000}
</style>
</head>
<body>
<pid="yy">我現(xiàn)在表現(xiàn)的是id選擇器</p>
<pid="p">我沒有被id選擇器修飾</p>
<h1>我沒有被任何的選擇器修飾</h1>
</body>
</html>
3:類選擇器,類選擇器以.開頭 只要把元素的class="" 就能表現(xiàn)為這種樣式了用法是:class=""
復(fù)制代碼
代碼如下:<html>
<head>
<styletype="text/css">
.yy{font:"宋體"; color:#FF0000}
</style>
</head>
<body>
<pclass="yy">我現(xiàn)在表現(xiàn)的是類選擇器</p>
<pclass="yy">我沒有被類選擇器修飾</p>
<h1>我沒有被任何的選擇器修飾</h1>
</body>
</html>
相關(guān)文章
css選擇器設(shè)置標(biāo)簽樣式的實(shí)例代碼
這篇文章主要介紹了css選擇器設(shè)置標(biāo)簽樣式的實(shí)例代碼,需要的朋友可以參考下2018-11-22CSS3 :not()選擇器實(shí)現(xiàn)最后一行l(wèi)i去除某種css樣式
在日常開發(fā)中經(jīng)常會遇到在循環(huán)中的最后一個li不同于其他的li,要去除某種css樣式,本文介紹的是利用CSS3新增的:not()偽類選擇符,實(shí)現(xiàn)起來非常的方便,感興趣的朋友們下面2016-10-19- CSS中的選擇器是分權(quán)重的,如果不加注意則很有可能會遇到樣式層疊的問題,下面我們就來詳解CSS中的選擇器優(yōu)先級及樣式層疊問題解決,需要的朋友可以參考下2016-06-14
- 這里為大家送上CSS中的各種選擇器與樣式優(yōu)先級小結(jié),基本上常用的都被整理在其中,歡迎隨看隨記^^2016-05-24
CSS3 :nth-child()偽類選擇器實(shí)現(xiàn)奇偶行顯示不同樣式
css3的強(qiáng)大,讓人驚嘆,今天我們就來“前瞻”一下CSS3的一個偽類選擇器“:nth-child()”實(shí)現(xiàn)奇偶行顯示不同樣式,具體的詳細(xì)示例可以參考下文,希望對大家有所幫助2013-11-05- 這篇文章主要介紹了CSS 樣式的使用方式、選擇器 的相關(guān)資料,需要的朋友可以參考下2019-08-12