HTML 保证金问题

Question

问题本质上是页面顶部的浅绿色条。我想摆脱它。我不确定这是因为边距还是其他原因。我知道我的背景颜色是浅绿色，但由于某些原因，h1 在页面上太靠下了。

HTML:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">

        <link href="css/style.css" rel="stylesheet" type="text/css">
        <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>
        <link href='https://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css'>

        <title>Portfolio</title>
    </head>
    <body>
        <div class="wrapper">
            <div align="center" class="main-title"><h1>Portfolio</h1></div>
        </div>
    </body>
</html>

CSS:

.main-title {
    font-size: 1.25em;
    font-family: "Ubuntu Condensed";
    background-color: rgb(34, 147, 0);
    margin: 0;
}

body {
    background: rgba(176, 255, 173, 0.52);
    margin: 0;
}

我在这里创建了一个 JSFiddle 来演示我的问题：https://jsfiddle.net/r2vf5qe5/

Answer 1

在CSS中添加以下内容即可解决您的问题。

h1 {
  margin: 0;
}

Answer 2

您忘记了默认的 h1 边距添加此代码，它将起作用

h1 {
  margin: 0;
}

要删除绿色背景，请使用此代码 https://jsfiddle.net/r2vf5qe5/7/

Answer 3

转到页面属性并将上边距设置为 0（外观 HTML），因为默认上边距值为 1px。

<body topmargin="0">

HTML 保证金问题

HTML Margin Problems

html

css

margin