html - 为什么 h2 没有出现在页面的任何地方?

标签 html css

我目前正在学习 HTML 和 CSS,我尝试制作我的第一个网页,但当我意识到我的 h2 没有出现在页面上的任何地方时,我陷入了困境。对不起,我是菜鸟,不知道我做错了什么。请帮忙!谢谢!

*{
    margin: 0;
    padding: 0;
    border: 0;
}
header{
    position: fixed;
    background-color: black;
    width: 100%;
}
ul{
    float: right;
    padding-right: 15px;
    text-align: center;
}
ul li{
    list-style: none;
    display: inline-block;
    padding: 15px;
    padding-bottom: 20px;
}
ul li a{
    text-decoration: none;
    color:white
}

a:hover{
    font-size: 20px;
    color: green;
}

header h1{
    color: red;
    text-align: center;
    padding-top: 20px;
}
body{
    background-color: red;
}
nav{
    margin-right: 38%;
}
h2{
    color: blue;
    background-color: white;
}
<!DOCTYPE html>
<html>

<head>
    <title>TryOne</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
    <header>
        <h1>My Portfolio</h1>
        <nav>
            <ul>
                <li><a href="#">Home</a></li>
                <li><a href="#">Work</a></li>
                <li><a href="#">Testimonials</a></li>
                <li><a href="#">Contact</a></li>
            </ul>
        </nav>
    </header>
    <div>
        <h2>Hello!</h2>
    </div>
</body>

</html>

最佳答案

你的标题是固定的...你需要将你的 div 向下移动 margin .. FIDDLE

<header>
    <h1>My Portfolio</h1>

    <nav>
        <ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">Work</a></li>
            <li><a href="#">Testimonials</a></li>
            <li><a href="#">Contact</a></li>
        </ul>
    </nav>
</header>

<div id="DIV">
    <h2>Hello!</h2>
</div>

--

*{
    margin: 0;
    padding: 0;
    border: 0;
}
header{
    position: fixed;
    background-color: black;
    width: 100%;

}
ul{
    float: right;
    padding-right: 15px;
    text-align: center;
}
ul li{
    list-style: none;
    display: inline-block;
    padding: 15px;
    padding-bottom: 20px;
}
ul li a{
    text-decoration: none;
    color:white
}

a:hover{
    font-size: 20px;
    color: green;
}

header h1{
    color: red;
    text-align: center;
    padding-top: 20px;
}
body{
    background-color: red;
}
nav{
    margin-right: 38%;
}
h2{
    color: blue;
    background-color: white;
}
#DIV{
  position:absolute;
margin-top: 125px;
}

关于html - 为什么 h2 没有出现在页面的任何地方?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34572997/

相关文章:

c# - 从 HTML 源文件中读取数据

jquery - 如何在 1 行(css)中添加多个按钮?

css - 媒体查询指定的分辨率与现实不同

html - 摆脱额外的高度 - CSS 重置?

html - 当一个元素是多列布局中唯一的一个元素时,如何将其居中

image - 如何编写复杂的响应式图像网格

javascript - 永久保存表单数据

javascript - AngularJS:在固定位置元素上动画 ng-show 和 ng-hide

html - 如何在标题框内制作字幕框

internet-explorer-8 - dximagetransform.matrix,在 IE 8 标准模式下绝对定位不旋转的子元素