如何使文本懸停區域不是整行？

Question

這裏是我的代碼：

<a href="index.html"><p class="link">Link</p></a> 

然後在CSS：

p.link {color:black} 
p.link:hover {color:aqua} 

如何讓這個鏈接的時候，我沒有直接在它不會被選中？因爲當我將鼠標移動到左側或右側時，它仍會改變顏色。換句話說，當文本停止時，如何讓文本的懸停區域停止？而不是全線？

我認爲段落標記會阻止，但它沒有奏效。

Answer 1

簡單的邏輯上來說，你會把你的左右標記<a>你<p>標記爲<p>定義文本的整個塊，而一個<a>通常定義選定的文本。

你會風與此

<p class="link"><a href="index.html">Link</a></p> 

CSS：

a {color:black} 
a:hover {color:aqua} 

Answer 2

只要把周圍的<a>標籤<p>標籤，並在你的CSS選擇a S，不是p的。切勿將塊元素放入內聯元素中。 js fiddle