造型元素的背景HTML

我正在製作一個網站，我嘗試了一些新的東西，除了當我嘗試爲我的H1元素創建背景時我沒有辦法確保背景顏色邊框適合頂部屏幕左，右。造型元素的背景HTML

<!DOCTYPE html> 
<html lang="en"> 
<link rel="stylesheet" type="text/css" href="site.css" 
<body> 
<title>Test Tab</title> 
<div class="main"> 
    <h1>Website Heading</h1> 
</div> 

</body> 
</html> 

.main { 
font-family: Arial, Verdana, sans-serif; 
text-align: center; 
font-size: 20px; 
background-color: #00ff00; 
background-position: 10px; 
}

來源

2016-03-22 Matt

你需要你的CSS改成這樣：

html,body { 
    margin:0; 
    padding:0; 
} 
.main { 
font-family: Arial, Verdana, sans-serif; 
text-align: center; 
font-size: 20px; 
background-color: #00ff00; 
background-position: 10px; 
} 

.main h1 { 
    margin:0; 
}

JSFiddle

你需要確保你設置你的身體有沒有填充或利潤率，並確保您的h1沒有按沒有任何餘地。這樣它會高興地坐在你的頁面頂部。

來源

2016-03-22 09:48:21 Albzi

謝謝。然而，我的問題是，我不能讓背景顏色變得更大，並且與邊距相匹配，所以顏色會觸及網頁的頂部，例如 – Matt

造型元素的背景HTML

回答

相關問題