用颜色填写页面?

时间:2015-06-17 16:43:36

标签: html css margin padding

所以我试图用颜色完全填充边框上方的标题部分。但似乎有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;
}

2 个答案:

答案 0 :(得分:1)

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

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

}

答案 1 :(得分:0)

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

<script>
var chart;
function requestData() {
    $.ajax({
        url: 'live-server-data.php',
        success: function(point) {
            var series = chart.series[0],
                shift = series.data.length > 20;
            chart.series[0].addPoint(point, true, shift);
            setTimeout(requestData, 1000);    
        },
        cache: false
    });
}
</script>

或者只是添加HTML后的正文