各地標題元素

Question

我試圖刪除圍繞<h2>元素的所有空間，刪除多餘的空間

我有這個簡單的標記：

<div> 
    <h2>Count down</h2> 
</div> 

我試圖與刪除間距：

h2 { 
    margin: 0; 
    padding: 0; 
    line-height: 0; 
} 

但仍有一些空白。你可以看到它在這個屏幕截圖上：

有間距和上下都沒有（也不是填充或邊距）。我怎樣才能擺脫多餘的空間？

編輯：下面是一個簡單jsfiddle來說明。我想刪除淺藍色的空間。

Answer 1

您在倒數類有padding爲你做它的全球就會把填充在頂部底部包圍的40px您H2左右在40px修復試試這個

.countdown { padding:0px 40px 0px 40px; } 

如果你指的是H2在底部有空格，因爲你有一個樣式，把10px的邊距放在底部，以刪除只刪除該樣式。

.countdown h2 { margin: 0 0 10px; } 

如果你不想刪除它，你可以通過做

h2 { 
    margin: 0px !Important; 
    padding: 0px; 
    line-height: 0; 
    } 

在此改變它，你真的不應該使用!important，除非真正需要，在這種情況下，它不是。

Answer 2

的截圖督察顯示

.countdown h2 { 
    margin: 0 0 10px; 
} 

這相當於：

.countdown h2 { 
    margin-bottom: 10px; 
} 

也就是說，你必須在你的CSS有一個風格的h2地方。

因爲樣式嵌套爲.countdown h2，所以它會優先於僅自定義樣式h2。

如果無法刪除它，寧可不使用!important覆蓋它，您可以覆蓋風格，如：

body .countdown h2 { 
    margin: 0; 
} 

這使得它三個元素，使得它比兩個更具體在檢查員。看看它是如何在這裏工作的例子：JS Fiddle

---

更多關於CSS的優先級：W3 - The cascade