Css 网页有顶部填充-无法摆脱它_Css_Html

Css 网页有顶部填充-无法摆脱它

css html

Css 网页有顶部填充-无法摆脱它,css,html,Css,Html,我要发疯了，试图摆脱网页顶部的小填充物。它显示在所有浏览器中。这是一张照片 <!DOCTYPE html> <html lang="en"> <head> <meta charset=UTF-8" /> <link href="mainpage.css" rel="stylesheet" type="text/css" /> <title>Mobile Development</title> </head

我要发疯了，试图摆脱网页顶部的小填充物。它显示在所有浏览器中。这是一张照片

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=UTF-8" />
<link href="mainpage.css" rel="stylesheet" type="text/css" />
<title>Mobile Development</title>
</head>

<body>
<div id="topnavcontainer">
<ul id="navlist">
    <li id="active"><a href="#" id="current">Services</a></li>
    <li><a href="#">Mobile</a></li>
    <li><a href="#">Cloud</a></li>
    <li><a href="#">Development</a></li>
    <li><a href="#">Our Work</a></li>
    <li><a href="#">Contact</a></li>
</ul>
</div>  
<div id="bodycontainer">
</div>
</body>
</html>

您的

ul

和

li

是导航栏中的链接，它们的上边距需要删除

ul, li {
    margin-top:0;
}

设置：

此外，您的

标记有错误的语法。

每个浏览器都有自己的HTML标记默认CSS规则。您应该使用CSS重置（例如：）来删除浏览器CSS设置的属性（在您的页面中，ul元素具有默认CSS属性，该属性定义了一些页边距）。像这样的规则：

ul {margin: 0; padding: 0}

应删除ul元素的默认格式

正如其他人提到的，您没有正确地重置css样式，因此菜单的

ul

的默认边距将在顶部显示额外的边距。以下是解决此问题的快速方法：

ul#navlist {
   margin:0;
}

虽然我强烈推荐一个重置表，但通过简单地包含该表，问题就解决了：

这是有效的，你能给我解释一下*{margin:0；}为什么有效以及它的用途吗？@spentak:这被称为浏览器重置。特别是这一个不是很完整。CSS中的

规则将匹配所有elements@spentak：它起作用的事实意味着你有一个特定的因素导致它。您应该找到有问题的元素，而不是将所有

margin

s定义为0。我怀疑它是

li

@spentak margin是框外的间距，padding是框内的间距。哦，

*span{}

（例如）只在IE中起作用。我把它们弄糊涂了。li带有默认的边距？

ul

不一定像我最初说的那样。

ul {
    margin-top: 0;
}

ul {margin: 0; padding: 0}

ul#navlist {
   margin:0;
}