我刚开始学习 HTML 并且刚刚创建了这个静态:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../css/classes.css">
<link rel="stylesheet" type="text/css" href="../css/ids.css">
<title>Total Devastation</title>
</head>
<body>
<h1 class="header-main">Total Devastation</h1>
<div id="mainmenu">
<ul>
<li>
<a href="">Hello!</a>
</li>
<li>
<a href="">How</a>
</li>
<li>
<a href="">Are</a>
</li>
<li>
<a href="">You</a>
</li>
</ul>
</div>
<div id="body-main">
<p>
Hi there! Welcome to this newly created static RPG.
</p>
</div>
</body>
</html>
我想让 h1 容器(类 header-main)接触屏幕边缘，就像它接触右侧一样
这是 css 部分:
body {
background:#aaa;
}
.header-main {
background:#555;
font-family:calibri;
font-size:32pt;
color:#eee;
text-align:center;
margin-left:0;
padding:10px;
width:100%;
}
最佳答案
默认情况下 body 的边距为 8px，将其设置为 0..所以你的 h1 容器会接触到屏幕
CSS
body{
background:#aaa;
margin:0;
padding:0;
}
如果你想让 h1 触及浏览器的顶部...将 h1 边距设置为 0
.header-main {
background:#555;
font-family:calibri;
font-size:32pt;
color:#eee;
text-align:center;
margin:0; /*changes done */
padding:10px;
width:100%;
}
关于html - 如何使html中的h1标签触摸屏幕的边缘？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26031052/