這篇文章主要介紹CSS樣式不起作用的解決方法,文中介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們一定要看完!
10年積累的網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)經(jīng)驗(yàn),可以快速應(yīng)對(duì)客戶對(duì)網(wǎng)站的新想法和需求。提供各種問題對(duì)應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識(shí)你,你也不認(rèn)識(shí)我。但先做網(wǎng)站設(shè)計(jì)后付款的網(wǎng)站建設(shè)流程,更有蘇尼特右免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。
瀏覽器緩存問題
如果你反復(fù)檢查認(rèn)為代碼沒有問題,那么可能是瀏覽器緩存的問題。在排查前先試一下清除瀏覽器緩存,重啟瀏覽器或者換個(gè)瀏覽器等手段,無效后再進(jìn)行進(jìn)一步排查。有可能自己什么都沒有做錯(cuò),就是因?yàn)榫彺婊蛘邽g覽器的問題導(dǎo)致,重置一下也許問題就解決了。
瀏覽器的‘F12’元素審核,看看哪些樣式?jīng)]有應(yīng)用上。
細(xì)節(jié)問題
寫錯(cuò)屬性名致使無法與html匹配,或?qū)傩灾挡环弦?guī)范;
html標(biāo)簽沒寫完整,漏了“<”或者”>”等;
,;{}
看看這些符號(hào)是不是不小心使用了中文或者全角符號(hào);
設(shè)CSS樣式不起作用:例如:要定義span居中,必須先讓span成塊級(jí)元素顯示,也就是說,要先定義span的
display:block;
屬性,然后再給span添加邊距屬性margin:0px auto;
css樣式中間沒有加分號(hào);
為什么css樣式里有時(shí)候使用分號(hào)隔開有時(shí)候是用空格呢?
對(duì)同一個(gè)屬性進(jìn)行設(shè)置時(shí)是用空格隔開,比如border:1px solid red; 對(duì)不同的屬性進(jìn)行設(shè)置時(shí)是用分號(hào)隔開,比如width:300px;height:300px;
樣式表關(guān)聯(lián)問題
如果你的樣式完全不生效,首先確認(rèn)關(guān)聯(lián)了樣式表沒有,或者關(guān)聯(lián)的樣式位置、名字是否正確;
看看自定義的CSS樣式引入標(biāo)簽是否放在bootstrap框架樣式引用之后,確保不會(huì)被在加載頁(yè)面時(shí)被框架的樣式覆蓋。
選擇器問題
后代子代選擇等,涉及多個(gè)標(biāo)簽,類名、id等,子選擇器的順序、名字等寫錯(cuò)了,均可能導(dǎo)致出錯(cuò);
html里的標(biāo)簽忘記寫類名、id了,而選擇器用了這些漏寫的類名、id等,樣式自然不會(huì)生效。
后代選擇器忘了寫空格;
看看是不是有多余的空格比如: div.box{}
這類選擇器會(huì)不會(huì)寫成了 div .box{}
;
編碼格式問題
把CSS、HTML網(wǎng)頁(yè)文件都統(tǒng)一保存為UTF-8格式;即在頭標(biāo)簽中添加
因?yàn)?一般網(wǎng)頁(yè)里采用UTF-8的編碼格式,而外部的CSS文件默認(rèn)的是ANSI的編碼格式,一般情況下是不會(huì)有問題。然而當(dāng)CSS文件中包含中文注釋,就可能會(huì)出現(xiàn)問題。
樣式層疊問題
看看你的css優(yōu)先級(jí)是否出現(xiàn)問題,優(yōu)先級(jí)高的會(huì)把低的覆蓋掉導(dǎo)致無法看到樣式;
本身設(shè)置了樣式,則從父級(jí)繼承來的樣式就不生效了;css樣式優(yōu)先級(jí)排序:
!important > 行內(nèi)樣式>ID選擇器 > 類選擇器 > 標(biāo)簽 > 通配符 > 繼承 > 瀏覽器默認(rèn)屬性(同優(yōu)先級(jí)時(shí),后面的層疊前面的樣式);
排查順序:
以上是“CSS樣式不起作用的解決方法”這篇文章的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對(duì)大家有幫助,更多相關(guān)知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!