时间戳

首页 > 解决方案 > 如何删除顶部的白条？

html - 如何删除顶部的白条？

问题描述

我的网站顶部的空白区域（或栏）存在一些问题。

正如其他一些帖子所暗示的那样，我尝试过使用不同的填充和位置值，但似乎没有任何效果。

h1 {
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  position: relative;
  top: 150px;
  left: 300px;
  z-index: 2;
  position: absolute;
  color: white;
  margin: 0;
}

h2 {
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  position: relative;
  top: 230px;
  left: 300px;
  z-index: 2;
  color: white;
  font-weight: 100;
  font-style: italic;
}

img {
  z-index: 1;
  position: absolute;
  padding-top: 0;
}
<!DOCTYPE html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Hayao Miyazaki Tribute Page</title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="miyazaki.css">
</head>

<div id="main" class="image">
  <h1>Hayao Miyazaki</h1>
  <h2> “They say that the best blaze burns brightest when circumstances are at their worst.”&lt;/h2>
  <img alt="Miyazaki Black and White" src="https://wallpaperaccess.com/full/244942.jpg">
</div>

<body>

  <script src="" async defer></script>
</body>

</html>

标签： htmlcss

解决方案

您应该将边距 0 添加到正文类

css

body{
background: #fff;
margin: 0;
}

推荐阅读