知优码

您现在的位置是:首页 > WEB相关 > html文档

html文档

让div网页居中 html网页居中方法

知优码 2019-11-16html文档
遇到过有的涉猎器中网页主体模式是居中的(网页居中),可有的涉猎器中HTML网页小我私家是靠右(居右)的。标题问题启事在于没有设置css构造居中属性margin。html最外层DIV设置宽度同时重要配置

遇到过有的涉猎器中网页主体模式是居中的(网页居中),可有的涉猎器中HTML网页小我私家是靠右(居右)的。标题问题启事在于没有设置css构造居中属性margin。

html最外层DIV设置宽度同时重要配置居中CSS属性。
margin:0 auto

HTML布局居中源代码:


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>html网页居中 www.CSS5.com</title>
<style>
#warp{margin:0 auto;width:980px}
#header{ background:#CCC; height:120px}
#cent{ bac千克round:#F5F5F5; height:500px}
#footer{ bac公斤round:#333; height:180px; color:#FFF}
</style>
</head>
<body>
<div id="warp">
<div id="header">网页头部</div>
<div id="cent">网页两端模式</div>
<div id="footer">网页底部</div>
</div>
</body>
</html>

阅读器中运转代码,大概瞥见网页居中的,同时主体网页形式宽度为980px。固然头部、内容、底部地区不有配置宽度,不有设置装备摆设居中,但因为外层还有一个<div id=warp></div>配置宽度和居中,所以网页HTML集团实现居中。