L-V-H-A是link、visited、hover、active的簡寫，它們分別表示超鏈接的默認樣式、訪問過的鏈接樣式、處于鼠標懸停狀態(tài)的鏈接樣式和被激活（也就是鼠標按下去那一瞬間）的鏈接樣式。
創(chuàng)新互聯(lián)建站公司2013年成立，先為天壇街道等服務(wù)建站，天壇街道等地企業(yè)，進行企業(yè)商務(wù)咨詢服務(wù)。為天壇街道企業(yè)網(wǎng)站制作PC+手機+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。
“被點擊訪問過的超鏈接樣式不在具有hover和active了,解決方法是改變CSS屬性的排列順序:
L-V-H-A”這句話的意思是，在定義超鏈接樣式的時候，推薦按照link/visited/hover/active的順序來定義超鏈接偽類，例如按照下面的寫法：
a:link
{color:red}
a:visited
{colre:blue}
a:hover
{color:black}
a:active
{color:gray}
按照這樣的順序來定義超鏈接，這四個樣式就不會相互干擾，如果順序錯了，在某些瀏覽器里面有可能會出現(xiàn)某個樣式不起作用的bug。
當創(chuàng)建的樣式表越來越復(fù)雜時，一個標簽的樣式將會受到越來越多的影響，這種影響可能來自周圍的標簽，也可能來自其自身。下面我們從這兩方面去看看 CSS 樣式的優(yōu)先級。
CSS 的繼承性
CSS 的繼承特性指的是應(yīng)用在一個標簽上的那些 CSS 屬性被傳到其子標簽上?？聪旅娴?HTML 結(jié)構(gòu)：
div
p/p/div
如果?div?有個屬性?color: red，則這個屬性將被?p?繼承，即?p?也擁有屬性?color: red。
由上可見，當網(wǎng)頁比較復(fù)雜， HTML 結(jié)構(gòu)嵌套較深時，一個標簽的樣式將深受其祖先標簽樣式的影響。影響的規(guī)則是：
CSS 優(yōu)先規(guī)則1：?最近的祖先樣式比其他祖先樣式優(yōu)先級高。
例1：
!-- 類名為 son 的 div 的 color 為 blue --div style="color: red"
div style="color: blue"
div class="son"/div
/div/div
如果我們把一個標簽從祖先那里繼承來的而自身沒有的屬性叫做"祖先樣式"，那么"直接樣式"就是一個標簽直接擁有的屬性。又有如下規(guī)則：
CSS 優(yōu)先規(guī)則2："直接樣式"比"祖先樣式"優(yōu)先級高。
例2：
!-- 類名為 son 的 div 的 color 為 blue --div style="color: red"
div class="son" style="color: blue"/div/div
選擇器的優(yōu)先級
上面討論了一個標簽從祖先繼承來的屬性，現(xiàn)在討論標簽自有的屬性。在討論 CSS 優(yōu)先級之前，先說說 CSS 7 種基礎(chǔ)的選擇器：
ID 選擇器， 如 #id{}
類選擇器， 如 .class{}
屬性選擇器， 如 a[href="segmentfault.com"]{}
偽類選擇器， 如 :hover{}
偽元素選擇器， 如 ::before{}
標簽選擇器， 如 span{}
通配選擇器， 如 *{}
CSS 優(yōu)先規(guī)則3：優(yōu)先級關(guān)系：內(nèi)聯(lián)樣式 ID 選擇器 類選擇器 = 屬性選擇器 = 偽類選擇器 標簽選擇器 = 偽元素選擇器
例3：
// HTMLdiv class="content-class" id="content-id" style="color: black"/div// CSS#content-id {
color: red;}.content-class {
color: blue;}div {
color: grey;}
最終的 color 為 black，因為內(nèi)聯(lián)樣式比其他選擇器的優(yōu)先級高。
所有 CSS 的選擇符由上述 7 種基礎(chǔ)的選擇器或者組合而成，組合的方式有 3 種：
后代選擇符： .father .child{}
子選擇符： .father .child{}
相鄰選擇符: .bro1 + .bro2{}
當一個標簽同時被多個選擇符選中，我們便需要確定這些選擇符的優(yōu)先級。我們有如下規(guī)則：
CSS 優(yōu)先規(guī)則4：計算選擇符中 ID 選擇器的個數(shù)（a），計算選擇符中類選擇器、屬性選擇器以及偽類選擇器的個數(shù)之和（b），計算選擇符中標簽選擇器和偽元素選擇器的個數(shù)之和（c）。按 a、b、c 的順序依次比較大小，大的則優(yōu)先級高，相等則比較下一個。若最后兩個的選擇符中 a、b、c 都相等，則按照"就近原則"來判斷。
例4：
// HTMLdiv id="con-id"
span class="con-span"/span/div// CSS#con-id span {
color: red;}div .con-span {
color: blue;}
由規(guī)則 4 可見，span 的 color 為 red。
如果外部樣式表和內(nèi)部樣式表中的樣式發(fā)生沖突會出現(xiàn)什么情況呢？這與樣式表在 HTML 文件中所處的位置有關(guān)。樣式被應(yīng)用的位置越在下面則優(yōu)先級越高，其實這仍然可以用規(guī)則 4 來解釋。
例5：
// HTMLlink rel="stylesheet" type="text/css" href="style-link.css"style type="text/css"@import url(style-import.css); div {
background: blue;}/stylediv/div// style-link.cssdiv {
background: lime;}// style-import.cssdiv {
background: grey;}
從順序上看，內(nèi)部樣式在最下面，被最晚引用，所以 div 的背景色為 blue。
上面代碼中，@import?語句必須出現(xiàn)在內(nèi)部樣式之前，否則文件引入無效。當然不推薦使用?@import?的方式引用外部樣式文件，原因見另一篇博客：CSS 引入方式。
CSS 還提供了一種可以完全忽略以上規(guī)則的方法，當你一定、必須確保某一個特定的屬性要顯示時，可以使用這個技術(shù)。
CSS 優(yōu)先規(guī)則5：屬性后插有?!important?的屬性擁有最高優(yōu)先級。若同時插有?!important，則再利用規(guī)則 3、4 判斷優(yōu)先級。
例6：
// HTMLdiv class="father"
p class="son"/p/div// CSSp {
background: red !important;}.father .son {
background: blue;}
雖然 .father .son 擁有更高的權(quán)值，但選擇器 p 中的 background 屬性被插入了 !important， 所以 p 的 background 為 red。
錯誤的說法
在學(xué)習(xí)過程中，你可能發(fā)現(xiàn)給選擇器加權(quán)值的說法，即 ID 選擇器權(quán)值為 100，類選擇器權(quán)值為 10，標簽選擇器權(quán)值為 1，當一個選擇器由多個 ID 選擇器、類選擇器或標簽選擇器組成時，則將所有權(quán)值相加，然后再比較權(quán)值。這種說法其實是有問題的。比如一個由 11 個類選擇器組成的選擇器和一個由 1 個 ID 選擇器組成的選擇器指向同一個標簽，按理說 110 100，應(yīng)該應(yīng)用前者的樣式，然而事實是應(yīng)用后者的樣式。錯誤的原因是：權(quán)重的進制是并不是十進制，CSS 權(quán)重進制在 IE6 為 256，后來擴大到了 65536，現(xiàn)代瀏覽器則采用更大的數(shù)量。。還是拿剛剛的例子說明。11 個類選擇器組成的選擇器的總權(quán)值為 110，但因為 11 個均為類選擇器，所以其實總權(quán)值最多不能超過 100， 你可以理解為 99.99，所以最終應(yīng)用后者樣式。
按照良好的CSS書寫規(guī)范來寫CSS代碼，這樣會提高代碼的閱讀體驗。下面具體說幾點。
CSS書寫順序
位置屬性(position, top, right, z-index, display, float等)
大小(width, height, padding, margin)
文字系列(font, line-height, letter-spacing, color- text-align等)
背景(background, border等)
其他(animation, transition等)
使用CSS縮寫屬性
CSS有些屬性是可以縮寫的，比如padding,margin,font等等，這樣精簡代碼同時又能提高用戶的閱讀體驗。
去掉小數(shù)點前的“0”
連字符CSS選擇器命名規(guī)范
1.長名稱或詞組可以使用中橫線來為選擇器命名。
2.不建議使用“_”下劃線來命名CSS選擇器，為什么呢？
輸入的時候少按一個shift鍵；
瀏覽器兼容問題 （比如使用_tips的選擇器命名，在IE6是無效的）
能良好區(qū)分JavaScript變量命名（JS變量命名是用“_”）
可設(shè)置的屬性（按順序）： "font-style font-variant font-weight font-size/line-height font-family"
font 簡寫屬性在一個聲明中設(shè)置所有字體屬性。
font-size和font-family的值是必需的。如果缺少了其他值，默認值將被插入，如果有默認值的話。
注意： line - height屬性設(shè)置行與行之間的空間。
例子：
p.ex1{
font:15px arial,sans-serif;
}
p.ex2{
font:italic bold 12px/30px Georgia,serif;
}
擴展資料：
1、font-style：指定文本的字體樣式。
屬性值：
normal：默認值。瀏覽器顯示一個標準的字體樣式。 ?
italic：瀏覽器會顯示一個斜體的字體樣式。 ?
oblique：瀏覽器會顯示一個傾斜的字體樣式。 ?
inherit：規(guī)定應(yīng)該從父元素繼承字體樣式。
2、font-variant：設(shè)置小型大寫字母的字體顯示文本，這意味著所有的小寫字母均會被轉(zhuǎn)換為大寫，但是所有使用小型大寫字體的字母與其余文本相比，其字體尺寸更小。
font-variant 屬性主要用于定義小型大寫字母文本。
屬性值：
normal：默認值。瀏覽器會顯示一個標準的字體。 ?
small-caps：瀏覽器會顯示小型大寫字母的字體。 ?
inherit：規(guī)定應(yīng)該從父元素繼承 font-variant 屬性的值。 ?
3、font-weight：屬性設(shè)置文本的粗細。
屬性值：
normal：默認值。定義標準的字符。 ?
bold：定義粗體字符。 ?
bolder：定義更粗的字符。 ?
lighter：定義更細的字符。 ?
100-900的整百數(shù)：定義由粗到細的字符。400 等同于 normal，而 700 等同于 bold。 ?
inherit：規(guī)定應(yīng)該從父元素繼承字體的粗細。
4、font-size：屬性用于設(shè)置字體大小。 ?
5、font - family：屬性指定一個元素的字體。
重慶分公司
重慶分公司
