CSS鏈接背景顏色寬度

如何在li元素中設置一個鏈接，使其背景更長，實際的文本和它們之間都是相互平行的？CSS鏈接背景顏色寬度

Example

CSS

.popoutsidebar li { margin-bottom: 20px; padding: 5px; } 
.popoutsidebar li a { background-color: #E5E5E5; color: #B94A48; padding: 10px; border-radius: 5px; } 
.popoutsidebar li a:hover { background-color: #B94A48; color: #FFFFFF; text-decoration: none; }

來源

2013-07-29 John Ayers

我們可以看到的jsfiddle或一些HTML代碼？ – Keith

'display：block'？ – putvande

<a> nchor標籤是內嵌在默認情況下。試試這樣：

.popoutsidebar li a { display:block }

display屬性讓你定義如何顯示某個HTML元素。

display：block表示該元素顯示爲一個塊，因爲段落和標題一直都是。一個塊在其上面和下面有一些空白，並且除了（例如，通過將浮點聲明添加到另一個元素）之外，它不允許在其旁邊有HTML元素。

display：inline表示該元素在同一行內的當前塊內部以行內顯示。只有在兩個塊之間時，該元素纔會形成一個「匿名塊」，但其最小可能寬度爲。

http://quirksmode.org/css/css2/display.html

來源

2013-07-29 17:46:30

修復它！哈哈謝謝。所以通過切換到塊來填充行。 –

正確。我在我的答案中添加了兩種顯示類型之間差異的解釋。 –

CSS鏈接背景顏色寬度

回答

相關問題