css如何強(qiáng)制增加優(yōu)先級(jí)

這篇文章主要介紹“css如何強(qiáng)制增加優(yōu)先級(jí)”的相關(guān)知識(shí)，小編通過(guò)實(shí)際案例向大家展示操作過(guò)程，操作方法簡(jiǎn)單快捷，實(shí)用性強(qiáng)，希望這篇“css如何強(qiáng)制增加優(yōu)先級(jí)”文章能幫助大家解決問(wèn)題。

創(chuàng)新互聯(lián)專業(yè)IDC數(shù)據(jù)服務(wù)器托管提供商，專業(yè)提供成都服務(wù)器托管，服務(wù)器租用，眉山服務(wù)器托管，眉山服務(wù)器托管，成都多線服務(wù)器托管等服務(wù)器托管服務(wù)。

在css中，可以通過(guò)設(shè)置“!important”聲明來(lái)強(qiáng)制增加優(yōu)先級(jí)；該聲明用于提高指定CSS樣式規(guī)則的應(yīng)用優(yōu)先權(quán)，會(huì)被添加到CSS樣式值的末尾以賦予該樣式更多權(quán)重，語(yǔ)法“選擇器{屬性:值 !important;}”。使用“!important”規(guī)則會(huì)打破樣式表的自然級(jí)聯(lián)效果，使得代碼難以維護(hù)；因此除非絕對(duì)必要，應(yīng)盡可能避免使用!important規(guī)則，它應(yīng)只在特殊情況下使用。

本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

在css中，可以通過(guò)設(shè)置“!important”聲明來(lái)強(qiáng)制增加優(yōu)先級(jí)。

!important聲明

!important用于提高指定CSS樣式規(guī)則的應(yīng)用優(yōu)先權(quán)；它被添加到CSS值的末尾以賦予它更多權(quán)重。

選擇器{屬性:值 !important;}

注意：屬性：值 !important 屬性值用空格隔開(kāi)即可。

在CSS中，樣式規(guī)則以級(jí)聯(lián)方式應(yīng)用于元素。下面這個(gè)列表中越靠前的權(quán)重越?。?/p>

●　瀏覽器樣式：是Web瀏覽器聲明的默認(rèn)樣式。

●　用戶聲明的樣式：是用戶使用瀏覽器選項(xiàng)設(shè)置或通過(guò)開(kāi)發(fā)人員調(diào)試工具修改的自定義樣式。

●　開(kāi)發(fā)中聲明的樣式：是網(wǎng)站開(kāi)發(fā)人員在CSS樣式表中聲明的樣式。

●　具有!important規(guī)則的開(kāi)發(fā)者聲明樣式。

●　具有!important規(guī)則的用戶樣式。

!important為開(kāi)發(fā)者提供了一個(gè)增加樣式權(quán)重的方法，比直接在元素的 style 屬性中設(shè)置 CSS 聲明還要高，一般用在 CSS 覆蓋 JavaScript設(shè)置上。

示例：

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>測(cè)試!Important</title>
</head>
<style type="text/css">
    #Box div
    {
        color: red;
    }
    .important_false
    {
        color: blue;
    }
    .important_true
    {
        color: blue !important;
    }
</style>
<body>
    <div id="Box">
        <div class="important_false">
            這一行末使用important</div>
        <div class="important_true">
            這一行使用了important</div>
    </div>
</body>
</html>

效果圖：

css如何強(qiáng)制增加優(yōu)先級(jí)

CSS代碼第一行設(shè)定了box里面所有div中字體色為紅色，第二行和第三行都用class重新定義了自身div的字體色為藍(lán)色，

不同的是，第二行未使用!important，而第三行使用了!

總結(jié)：

第一行字體顏色是紅色，可以證明，css樣式設(shè)置中，id的優(yōu)先級(jí)大于class，這行字還是紅色。

第二行字體顏色是藍(lán)色，可以證明，!important的優(yōu)先級(jí)最高，important_true的css樣式生效，這行字變?yōu)榱怂{(lán)色！

什么時(shí)候用!important規(guī)則？

除非絕對(duì)必要，否則不應(yīng)使用!important規(guī)則；使用!important規(guī)則會(huì)打破了樣式表的自然級(jí)聯(lián)效果，使得代碼難以維護(hù)。但是，在某些情況下你必須使用！important：

1、在測(cè)試和調(diào)試網(wǎng)站時(shí)，!important規(guī)則是非常有用的。

如果我們的代碼中存在一些CSS問(wèn)題，并且希望確保應(yīng)用特定的樣式，則可以使用!important規(guī)則在網(wǎng)站上臨時(shí)修復(fù)問(wèn)題，直到找到更好的方法（可能需要一些時(shí)間）。

2、輸出樣式表

!important規(guī)則也可用于輸出樣式表，以確保應(yīng)用樣式而不被其他任何內(nèi)容覆蓋。

結(jié)論

使用!important對(duì)于性能并沒(méi)有什么負(fù)面影響；但是從可維護(hù)性角度考慮，除非絕對(duì)必要，應(yīng)盡可能的避免使用!important規(guī)則，它應(yīng)該只在特殊情況下使用。

以上就是本篇文章的全部?jī)?nèi)容，希望能對(duì)大家的學(xué)習(xí)有所幫助。更多精彩內(nèi)容大家可以關(guān)注創(chuàng)新互聯(lián)相關(guān)教程欄目！??！

特別說(shuō)明：

!important在IE6中是不被識(shí)別的，例：

.testClass{ 
    color:blue !important; 
    color:red;
}

這種寫法在IE6下是識(shí)別不到的，.testCalss最后顯示為紅色，但也可以通過(guò)更改下寫法讓IE6識(shí)別到!important

.testClass{ 
    color:blue !important; 
} 
.testClass{ 
    color:red; 
}

關(guān)于“css如何強(qiáng)制增加優(yōu)先級(jí)”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識(shí)，可以關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，小編每天都會(huì)為大家更新不同的知識(shí)點(diǎn)。

文章題目：css如何強(qiáng)制增加優(yōu)先級(jí)
文章地址：http://www.muchs.cn/article20/ijcgjo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供企業(yè)網(wǎng)站制作、服務(wù)器托管、營(yíng)銷型網(wǎng)站建設(shè)、、網(wǎng)站營(yíng)銷、外貿(mào)建站

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容