多行HTML支持程序中的非可點擊區域

是否可以防止多行html定位標記中行之間的非可點擊區域？在這個例子中，我使用行高1.5，並且不能在行之間單擊。多行HTML支持程序中的非可點擊區域

我知道在html5中，我們可以把塊級標籤固定在<a><div>Link</div></a>這樣的錨上，但問題是這部分內容可以由用戶編輯，我不能要求他們編寫像這樣的錨鏈接。是否有可能只用css解決這個問題？

CSS：

a { 
    line-height:1.5em; 
}

HTML：

<a href="#">This is a <br> multiline anchor</a> 
<br><br><br> 
<a href="#">This is a very long anchor displayed as a multiline anchor without BR</a>

DEMO：

http://jsfiddle.net/ergec/F52uY/2/

2013-11-04 Ergec

的事情是，有合法的情況下，必須無法點擊。例如如何處理這種案例http://jsfiddle.net/F52uY/5/？ –

@ GabyakaG.Petrioli這不是一個問題，因爲這將被用於特定的CSS類只用於作爲彩色按鈕的錨點。 – Ergec

您可以將display: inline-block;或display: block設置爲a，然後可以點擊。

或者你可以增加padding，並在同一時間設定爲負margin。這將縮小差距。

2013-11-04 14:12:57 Krzysztof

當文本處於正常句子流時，它將不起作用。例如在http://jsfiddle.net/F52uY/8/ –

所以，也許嘗試填充/保證金竅門：http://jsfiddle.net/693z4/ – Krzysztof

無需保證金，只限制填充頂部/底部 –

如果你給你的錨標記一個display: block;你將有一個堅實的點擊區域。

a { 
    line-height:1.5em; 
    display: block; 
}

與 display: block;

的一個問題是不具有指定的寬度，然後整個100％的寬度是可點擊。

2013-11-04 14:13:25

逼近它不會影響您的文本的佈局的其餘部分搞亂（包括鏈接的周圍文本）的唯一方法是一些頂部/底部墊襯添加到這些鏈接..

所以將padding:3px 0;添加到您的代碼將解決問題。（這將需要調整，不過，相對於你的font-size和line-height）

2013-11-04 14:18:57

+1爲段落中的文字提供更靈活的解決方案。 –

回答