Login
网站首页 > 文章中心 > 其它

div居中怎么设置html

作者:小编 更新时间:2023-07-05 07:28:44 浏览量:366人看过

div居中可以用外边距margin属性来实现。1、新建html文档,在body标签中添加div标签,标签的id为"header",这时因为div标签中没有内容且没有设置样式,所以网页中陵芦显示空白:2、这时为div标签设置原题中的css样式,此时虽然div盒子显示了,但是没有居中:3、此时为div添加一个"margin:0auto"属性就会居中显示,"margin"指的是div标签的外边距,"0"指的是div标签上下的外边距,"auto"指的是div标签左右的外边距,并且会根据浏览历老器窗口大小自肢汪升动居中,这时就是完整的html和css代码。

CSS来实现DIV居中,用CSS实现DIV居中的方法有很多,这次教给大家的是比较简单并且兼容性很棒的一段代码,快点进来看看吧。

需链禅态要的主要css代码有两个,一个为text-align:center(内容居中),另袭激外一个为margin:0auto;其两个样式需要配合使用才能实现div盒子的居中显示排版。

首先我们对body设置text-align:center,再对需要居中的div盒子设置css样式margin:0auto,这样即可让对应div水平居中。

div居中代码应用,为了观察div居中效果,我们对div设置一个div命名为".div"在html中div标签内使用class="div",设置其宽度为400px;高度为100px,边框为红色。以便我们观察效果。

1、完整html◆css代码

div居中

以上就是土嘎嘎小编大虾米为大家整理的div居中怎么设置html相关主题介绍,如果您觉得小编更新的文章对您有所帮助,不要忘记讲本站分享给您身边的朋友哦!!

版权声明:倡导尊重与保护知识产权。未经许可,任何人不得复制、转载、或以其他方式使用本站《原创》内容,违者将追究其法律责任。本站文章内容,部分图片来源于网络,如有侵权,请联系我们修改或者删除处理。

编辑推荐

热门文章