Html 正在尝试将中心标题添加到我的页面 我想在我的页面中间添加一个中心文本标题，它不会出现。代码似乎正确，没有看到错误 <div id="welcome_text_div"> <p id="welcome_text"> Welcome </p> </div> #welcome_text_div { position: absolute; background-color:red; width:800px; height:300px; top: 50%; margin-top: -150%; left: 50%; margin-left: -400px; } #welcome_text { color: white; font-family: sans-serif; text-transform: uppercase; font-weight: bold; font-size: 55px; text-align: center; } 欢迎光临 #欢迎光临{ 位置：绝对位置； 背景色：红色； 宽度：800px； 高度：300px； 最高：50%； 利润率最高：-150%； 左：50%； 左边距：-400px； } #欢迎你发短信{ 颜色：白色； 字体系列：无衬线； 文本转换：大写； 字体大小：粗体； 字体大小：55px； 文本对齐：居中； }

试试这个

#欢迎(文本){
位置：绝对位置；
背景色：红色；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
}
#欢迎你发短信{
颜色：白色；
字体系列：无衬线；
文本转换：大写；
字体大小：粗体；
字体大小：55px；
文本对齐：居中；
宽度：800px；
线高：300px；
}

欢迎光临

试试这个

#欢迎(文本){
位置：绝对位置；
背景色：红色；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
}
#欢迎你发短信{
颜色：白色；
字体系列：无衬线；
文本转换：大写；
字体大小：粗体；
字体大小：55px；
文本对齐：居中；
宽度：800px；
线高：300px；
}

欢迎光临

您可以使用flexbox实现这一点

您只需定义容器的宽度和高度（并为其提供bg颜色）：

然后添加这三行以设置flexbox显示上下文，并将其垂直和水平居中：

display:flex;
align-items:center;
justify-content:center;

然后从内部div中删除所有额外的格式

#welcome_text_div {
    background-color:red;
    width:800px;
    height:300px;
    display:flex;
    align-items:center;
    justify-content:center;
}

#welcome_text {
    color: white;
    font-family: sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 55px;
}

---

您可以通过flexbox实现这一点

您只需定义容器的宽度和高度（并为其提供bg颜色）：

然后添加这三行以设置flexbox显示上下文，并将其垂直和水平居中：

display:flex;
align-items:center;
justify-content:center;

然后从内部div中删除所有额外的格式

#welcome_text_div {
    background-color:red;
    width:800px;
    height:300px;
    display:flex;
    align-items:center;
    justify-content:center;
}

#welcome_text {
    color: white;
    font-family: sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 55px;
}

---

只需使用文本对齐：居中，它就会自动居中。顺便说一句，我看到你经常使用ID，这是非常糟糕的做法。ID应用于javasscript选择器，而类应用于css

。居中文本{
文本对齐：居中；
}
.标题文本{
//在这里进行css格式化吗
}

欢迎光临

只需使用文本对齐：居中，它就会自动居中。顺便说一句，我看到你经常使用ID，这是非常糟糕的做法。ID应用于javasscript选择器，而类应用于css

。居中文本{
文本对齐：居中；
}
.标题文本{
//在这里进行css格式化吗
}

欢迎光临

感谢您的快速回答，效果非常好！如果有什么东西对你有用，请选择一个答案，这样他们就可以获得学分。感谢你的快速回答，工作完美！如果某件事情对您有效，请选择一个答案，以便他们可以获得学分。