本篇文章為大家展示了bootstrap中如何更改樣式,內(nèi)容簡明扼要并且容易理解,絕對能使你眼前一亮,通過這篇文章的詳細(xì)介紹希望你能有所收獲。
成都創(chuàng)新互聯(lián)"三網(wǎng)合一"的企業(yè)建站思路。企業(yè)可建設(shè)擁有電腦版、微信版、手機(jī)版的企業(yè)網(wǎng)站。實(shí)現(xiàn)跨屏營銷,產(chǎn)品發(fā)布一步更新,電腦網(wǎng)絡(luò)+移動網(wǎng)絡(luò)一網(wǎng)打盡,滿足企業(yè)的營銷需求!成都創(chuàng)新互聯(lián)具備承接各種類型的成都網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)項(xiàng)目的能力。經(jīng)過十年的努力的開拓,為不同行業(yè)的企事業(yè)單位提供了優(yōu)質(zhì)的服務(wù),并獲得了客戶的一致好評。一、css選擇器
1.標(biāo)簽選擇器(如:body,div,p,ul,li)
2.類選擇器(如:class)
3.ID選擇器(如:id)
4.全局選擇器(如:*號)
5.組合選擇器(如:.head .head_logo,注意兩選擇器用空格鍵分開)
6.后代選擇器 (如:#head .nav ul li 從父集到子孫集的選擇器)
7.群組選擇器 div,span,img {color:Red} 即具有相同樣式的標(biāo)簽分組顯示
8.繼承選擇器(如:div p,注意兩選擇器用空格鍵分開)
9.偽類選擇器(如:就是鏈接樣式,a元素的偽類,4種不同的狀態(tài):link、visited、active、hover。)
10.字符串匹配的屬性選擇符(^ $ *三種,分別對應(yīng)開始、結(jié)尾、包含)
11.子選擇器 (如:div>p ,帶大于號>)
12.CSS 相鄰兄弟選擇器器 (如:h2+p,帶加號+)
相關(guān)推薦:《bootstrap入門教程》
二、優(yōu)先級
當(dāng)在一個樣式聲明上使用 !important 規(guī)則時,該樣式聲明會覆蓋CSS中任何其他的聲明,ie6不支持該屬性。
內(nèi)聯(lián)樣式表的權(quán)值高 1000;即在html中給元素標(biāo)簽加style,即內(nèi)聯(lián)樣式。該方法會造成css難以管理,所以不推薦使用。
ID 選擇器的權(quán)值為 100;由一個或多個id選擇器來定義。例如,#id{margin:0;}id選擇器會覆蓋類選擇器.classname{margin:3pxl}。
Class 類選擇器的權(quán)值為 10;由一個或多個類選擇器、屬性選擇器、偽類選擇器定義。如.classname{margin:3px}會覆蓋div{margin:6px;}。
標(biāo)簽選擇器權(quán)值為 1:由一個或多個類型選擇器定義。如div{marigin:6px;}覆蓋*{margin:10px;}。
通配符選擇器:如*{marigin:6px;}。
瀏覽器自定義或繼承權(quán)值為0.1。
總結(jié)排序:!important > 行內(nèi)樣式>ID選擇器 > 類選擇器 > 標(biāo)簽 > 通配符 > 繼承 > 瀏覽器默認(rèn)屬性
三、!important
使用 !important 是一個壞習(xí)慣,應(yīng)該盡量避免,因?yàn)檫@打斷了樣式表中的固有的級聯(lián)規(guī)則 使得調(diào)試找bug變得更加困難了。當(dāng)兩條相互沖突的帶有 !important 規(guī)則的聲明被應(yīng)用到相同的元素上時,擁有更大優(yōu)先級的聲明將會被采用。
查詢的經(jīng)驗(yàn):
永遠(yuǎn)不要在全站范圍的 css 上使用 !important。
只在需要覆蓋全站或外部 css(例如引用的 ExtJs 或者 YUI )的特定頁面中使用 !important。
永遠(yuǎn)不要在你的插件中使用 !important。
要優(yōu)化考慮使用樣式規(guī)則的優(yōu)先級來解決問題而不是 !important。
上述內(nèi)容就是bootstrap中如何更改樣式,你們學(xué)到知識或技能了嗎?如果還想學(xué)到更多技能或者豐富自己的知識儲備,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。