用颜色填充页面？答案

【问题标题】：Filling in the page with colour?用颜色填充页面？
【发布时间】：2015-09-03 01:01:47
【问题描述】：

所以我试图用彩色填充边框上方的标题部分。但似乎有 3px 的空白区域刚好与整个页面接壤。我将整个页面的边距和填充设置为 0，所以我有点困惑。这是页面代码：

<DOCTYPE html?>
<head>
<title> Brittany Corl - Web Developer</title>
<link rel="stylesheet" href="CSSCoding.css">
<div id="MainHeader"><img id="HeaderPhoto" src="HeaderPhoto.png" height="100 px" width="100 px">
<center><h1>Brittany Corl - Web Developer/Graphic Designer</h1></center></div>
</head>
<body>
    <ul>
        <li><a href="home.html">Home</a></li>
        <li><a href="aboutme.html">About Me</a></li>
        <li><a href="myskills.html">Skills</a></li>
        <li><a href="work.html">Work</a></li>
        <li><a href="resume.html">Resume</a></li>
        <li><a href="contact.html">Contact</a></li>
    </ul>
</body>

这是 CSS：

html {
    width: 100%;
    margin: 0;
    padding: 0;
}

h1 {
    font-family: tahoma;
    font-size: 40px;
    padding-top: 30px;
    padding-bottom: 29px;
    border-bottom: medium solid black;
}

#HeaderPhoto {
    float: left;
    padding-right: 20px;
}

#MainHeader {
    background-color: #e0ffff;
}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

li {
    float: left;
    font-family: verdana;
    font-size: 20px;
}

a:link, a:visited {
    display: block;
    width: 120px;
    color: white;
    background-color: #99C0F2;
    text-align: center;
    padding: 4px;
    text-decoration: none;
    text-transform: uppercase;
}

a:hover, a:active {
    background-color: #5FA0F5;
}

【问题讨论】：

对于初学者，您的 HTML 无效。尝试通过validator.w3.org 运行它，直到您摆脱错误。然后记住body元素有默认边距，<center>元素不存在了。

标签： html css margin padding

【解决方案1】：

将以下内容添加到您的 css 中。

body {
margin: 0px;
padding: 0px;

}

【讨论】：

【解决方案2】：

尝试将页面正文的边距和内边距设置为零。

body
{
 width: 100%;
    margin: 0;
    padding: 0;
}

或者只是在 HTML 之后添加 ,body

【讨论】：