這篇文章給大家分享的是有關(guān)CSS中id和class選擇器如何使用的內(nèi)容。小編覺得挺實用的,因此分享給大家做個參考。一起跟隨小編過來看看吧。
目前創(chuàng)新互聯(lián)已為成百上千家的企業(yè)提供了網(wǎng)站建設(shè)、域名、雅安服務(wù)器托管、綿陽服務(wù)器托管、企業(yè)網(wǎng)站設(shè)計、江岸網(wǎng)站維護(hù)等服務(wù),公司將堅持客戶導(dǎo)向、應(yīng)用為本的策略,正道將秉承"和諧、參與、激情"的文化,與客戶和合作伙伴齊心協(xié)力一起成長,共同發(fā)展。id和class之間的區(qū)別
id具有唯一性,class可以有很多個
頁面中只能寫入一個ID,但是對于class可以寫入多個。
但是,這并不意味如果頁面只顯示一個就必須使用id。id的使用存在約束。
如果id和class有樣式?jīng)_突,則id優(yōu)先
讓我們舉一個例子來看一下。
HTML
<p id="red" class="blue">ID和class優(yōu)先級比較——文字顏色</p>
CSS
#red{ color:red; } .blue{ color:blue; }
效果如下:
上圖顯示的字體是紅色的,那是因為id的優(yōu)先級比class的優(yōu)先級高,所以最終顯示的顏色是紅色。
可以在頁面內(nèi)跳轉(zhuǎn)到id
通過鏈接到id,您可以跳轉(zhuǎn)到相應(yīng)的id位置。
<a name="#ananker name">跳轉(zhuǎn)到id </a>
經(jīng)常利用這個在頁面開頭設(shè)置跳躍功能。
可以在哪里使用id
首先,作為大前提,class的使用沒有限制,但是id有約束。
坦白地說,經(jīng)常也可以這樣做,即使你在沒有使用id的情況下用class描述的話也沒有問題,因此,與其考慮如何區(qū)分使用,不如考慮在哪里使用id。
使用id的地方是“唯一的”或者是“最好做的”。
當(dāng)你想要添加頁內(nèi)跳轉(zhuǎn)功能時
使用頁內(nèi)跳轉(zhuǎn)功能時,請使用id,因為它無法用class實現(xiàn)。
用于可以設(shè)置“唯一”的地方
頁面中基本上只有一個頁面部分,例如標(biāo)題,內(nèi)容,側(cè)邊欄,頁腳。這樣的東西利用id比較容易實現(xiàn)。
總結(jié)class中的常用部分,用id覆蓋樣式
這是一種利用CSS的規(guī)格,其中id優(yōu)先于class。
網(wǎng)頁根據(jù)頁有一定的布局,但是有很多相似的部分。您可以通過將標(biāo)準(zhǔn)樣式編寫為class并使用id編寫每個頁面的特征部分來壓縮CSS。
id的選擇器匹配過程更快
當(dāng)使用jQuery等執(zhí)行選擇器匹配處理時,指定id時速度更快。這是因為,如果它是由id指定的,那么在頁面中找到它就可以完成處理,而如果是class的話則需要掃描到結(jié)尾。
感謝各位的閱讀!關(guān)于CSS中id和class選擇器如何使用就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,讓大家可以學(xué)到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
網(wǎng)站欄目:CSS中id和class選擇器如何使用-創(chuàng)新互聯(lián)
網(wǎng)頁網(wǎng)址:http://aaarwkj.com/article16/dddjdg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供企業(yè)網(wǎng)站制作、網(wǎng)站制作、ChatGPT、品牌網(wǎng)站設(shè)計、網(wǎng)站導(dǎo)航、品牌網(wǎng)站建設(shè)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容