让父级div中的多个子div水平居中，非float:left实现。

最新推荐文章于 2022-08-03 17:01:58 发布

WindBlows风

最新推荐文章于 2022-08-03 17:01:58 发布

阅读量988

点赞数

分类专栏： CSS 文章标签： CSS实现多个子Div水平居中

本文链接：https://blog.csdn.net/WhenTheWindBlows/article/details/86759381

版权

CSS 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

需要三个div实现。
最外层父Div的属性设为：margin: 0 auto;
二级父Div的属性设定为：text-align：center；
最内层子Div的公共属性设定为：display:inline-block;
【温馨提示：这种情况下，最内层div之间有间隔，可以在二级父标签中,添加一个margin:-*px,或者添加一个属性font-size:0,同时最内层如果显示有文字，则需要额外在最内层属性总添加font-size:**px，该方法适用于一些图片】
例子：
html

<div class="footer">
	<div class="footer_container">
		<div class="footer_content">购物指南</div>
		<div class="footer_content">售后服务</div>
		<div class="footer_content">定制须知</div>
	</div>
</div>

css代码

.footer{padding-bottom:30px;width:1100px;height:300px;margin: 0 auto;}
.footer_container{text-align:center;}
.footer_content{  display: inline-block;}