html中如何多个div并排居中排列?

html中如何多个div并排居中排列?,第1张

改一下代码,假设是这样

<div id="testContainer">

<div><img src="1.png"></div>

<div><img src="1.png"></div>

<div><img src="1.png"></div>

<div><img src="1.png"></div>

<div><img src="1.png"></div>

<div><img src="1.png"></div>

<div><img src="1.png"></div>

<div><img src="1.png"></div>

</div>

CSS:

#testContainer {

text-align: center

}

#testContainer >div {

display: inline-block

}

#testContainer img {

width: 200px

height: 200px

}

其实楼上有个朋友说得对,把 img 外面的 div 去掉默认就是行内并排的,除非你 div 还要做其他互动

<p style="display:blockwidth:50%float:leftheight:200pxbackground-color:#FF0000text-align:center">1</p>

<p style="display:blockwidth:50%float:leftheight:200pxbackground-color:#00FF00text-align:center">2</p>

DIV/块与上面方法相同

TABLE/表格,只要两个或多个表格宽度和不超过要显示区的宽度,就可以在一行中显示,居中可以放到CENTER标签中.


欢迎分享,转载请注明来源:内存溢出

原文地址:https://www.54852.com/zaji/6274826.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-03-19
下一篇2023-03-19

发表评论

登录后才能评论

评论列表(0条)

    保存