下劃線不走的方式

我想我的鏈接的話是紅色和下劃線顯示，只有當它盤旋着，這是我的代碼：下劃線不走的方式

a:hover div { 
 
    text-decoration: underline; 
 
} 
 
a div{ 
 
    color: red; 
 
    text-decoration: none; 
 
}

<a href=""> 
 
    <div>next page</div> 
 
</a>

現在文本的顏色是紅色的，但下劃線不會消失。爲什麼？

2016-07-25 Gropai

如何內嵌元素'了'包含塊元素'div' –

@MarkPerera在HTML5中，你可以有一個內聯塊元素元件。 –

只是閱讀它。但只適用於'a' –

下劃線是不是因爲在div風格。這是a標籤的默認樣式。在你的CSS選擇器中刪除DIV部分：

a:hover { 
 
    text-decoration: underline; 
 
} 
 
a { 
 
    color: red; 
 
    text-decoration: none; 
 
}

<a href=""> 
 
    <div>next page</div> 
 
</a>

2016-07-25 11:41:54 wasthishelpful

試試這個，只需設置text-decoration:none爲a tag。

a{ 
    color: red; 
    text-decoration: none; 
} 

a:hover div { 
text-decoration: underline; 
}

a:hover div { 
 
     text-decoration: underline; 
 
    } 
 
a{ 
 
     color: red; 
 
     text-decoration: none; 
 
    }

<a href=""> 
 
     <div>next page</div> 
 
</a>

2016-07-25 11:35:36 frnt

你不能有內聯項目（a）內的塊級項目（div）。因此，不支持它的瀏覽器可能會將div從a中刪除。相反，使用span並給display: block它，而a在block或inline-block。

但是對於那些支持這種行爲的瀏覽器，你的解決方案將是下面的代碼片段：

a { 
 
    color: red; 
 
    text-decoration: none; 
 
} 
 
a:hover div { 
 
    text-decoration: underline; 
 
}

<a href=""> 
 
    <div>next page</div> 
 
</a>

2016-07-25 11:35:44

你能否給出一些解釋，說明爲什麼這樣會起作用？ – Gropai

@Gropai在嵌入式項目（'a'）內不能有塊級項目（'div'）。因此，目前還不支持它的瀏覽器可能會拋出'a'中的'div'。相反，使用'span'並給它'display：block'，同時在'block'或'inline-block'中有'a'。 –

@PraveenKumar網站已經移動，你可以把任何你喜歡的東西放在錨標記中;） – Pete

回答