Html 将身体内容放在中心_Html_Css

Html 将身体内容放在中心

html css

Html 将身体内容放在中心,html,css,Html,Css,我使用中心标记，但这似乎不是HTML5中的标准。我试着用CSS来代替，但它对我不起作用！在本例中，我希望div标记显示在中间，但不会 <!doctype html> <html> <body style="text-align:center"> <div style="width:100px; height:30px; background-color:rgb(0,0,0)"></div> </body> </html

我使用中心标记，但这似乎不是HTML5中的标准。我试着用CSS来代替，但它对我不起作用！在本例中，我希望div标记显示在中间，但不会

<!doctype html>
<html>
<body style="text-align:center">
<div style="width:100px; height:30px; background-color:rgb(0,0,0)"></div>
</body>
</html>

这是中心标签版本：（它可以工作）

您可以为您的div使用

margin:auto

div {
    margin: auto;
    width:100px; 
    height:30px; 
    background-color:rgb(0,0,0)
}

另外，如果HTML标记变得更复杂，并且使用外部CSS而不是像现在这样的内联样式，那么最好给

div

一个

id

或类名来更准确地定位它

您可以使用css：

.window{
    position:absolute;
    top:50%;
    left:50%;
    margin-top:-140px;
    margin-left:-200px;
    width:400px;
    height:280px;
}

确保使用边距减去宽度和高度的一半。这样，您的div将在div所在的窗口中居中。

您要将div标记放在身体中央的div标记必须是：

.div-class {
    margin: auto;
}

如果使用“页边距顶部”或“页边距底部”，可以这样做：

.div-class {
    margin-left: auto;
    margin-right: auto;
}

谢谢。现在开始工作了！我使用外部css，但只为这个例子编写这样的css。当然，页边空白前面的0是不必要的。（页边距：自动；）

.div-class {
    margin-left: auto;
    margin-right: auto;
}