Html 在CSS中向下移动标题_Html_Css

Html 在CSS中向下移动标题

html css

Html 在CSS中向下移动标题,html,css,Html,Css,我试图学习HTML和CSS，但遇到了一个小小的障碍我有以下代码： <!DOCTYPE html> <html> <head> <title>Testing My HTML and CSS</title> <style> * { padding: 0; margin: 0; } .header {

我试图学习HTML和CSS，但遇到了一个小小的障碍

我有以下代码：

<!DOCTYPE html>
<html>
<head>
    <title>Testing My HTML and CSS</title>
    <style>

        * {
            padding: 0;
            margin: 0;
        }

        .header {
            background-color: black;
            height: 100px;
            width: 100%;
        }

        .header h1 {
            margin-top: 0;
            text-align: center;
            color: white;
            height: 100px;
            width: 100%;
        }

        .sidebar {
            background-color: #ebebeb;
            position: absolute;
            width: 200px;
            height: 100%;
        }

    </style>
</head>
<body>
    <div class="header">
        <h1>Hello, World!</h1>
    <div class="sidebar">
    </div>
    <div class="content">
    </div>
    <div class="footer">
    </div>
</body>
</html>


测试我的HTML和CSS
* {
填充：0；
保证金：0；
}
.标题{
背景色：黑色；
高度：100px；
宽度：100%；
}
.标题h1{
边际上限：0；
文本对齐：居中；
颜色：白色；
高度：100px；
宽度：100%；
}
.侧边栏{
背景色：#ebebebeb；
位置：绝对位置；
宽度：200px；
身高：100%；
}
你好，世界！

它可以运行

我想要

你好，世界

位于

标题的中心

。我试过在

.header h1

中使用

边距顶部

，但它会移动整个

.header

很抱歉问这么简单的问题--我是一个完全的新手。

使用线条高度，如下所示：

.header {
            background-color: black;
            height: 100px;
            width: 100%;
            line-height:2;
        }

使用线高度，如下所示：

.header {
            background-color: black;
            height: 100px;
            width: 100%;
            line-height:2;
        }

如果您不打算在标题中添加更多元素，您可以只添加行高：100px；到.header h1规则集。就这样

垂直对齐可能很棘手，如果您不想让大量代码乱七八糟的话，这是实现垂直对齐的最短方法。作为一般规则，要将文本垂直居中到元素中，只需使其行高等于元素的高度（除非您有一些填充或更改边距的内容）。

如果您不打算在标题中添加更多元素，您可以只添加行高：100px；到.header h1规则集。就这样

请尝试此方法

或者你可以使用

.header{
line-height:3;
   }

请试试这个

或者你可以使用

.header{
line-height:3;
   }

使用行高：100px on .Head H1的工作。使用行高属性为100px意味着文本将在行的中间垂直居中。还可以使用页眉作为“代码>显示：表”；代码>和代码>标题H1 AS <代码>显示：表单元格< /代码>使用行高度：100px on .Head H1的工作。使用行高属性为100px意味着文本将在行的中间垂直居中。还可以使用页眉作为“代码>显示：表；<代码>和

。标题h1

作为

显示：表格单元格