如何让一个块级元素水平垂直居中

发布网友发布时间：2022-04-23 06:11

共1个回答

热心网友时间：2022-04-06 09:04

div实现水平居中只需要设置固定宽度和margin:0 auto即可，给你2个解决方案: 1、条件是div的高度和宽度是固定的 <style type="text/css">  </style> <div class="div1"> <div class="div2">让层垂直居中</div> </div> 其实解决的思路是这样的：首们需要position:absolute;绝对定位。而层的定位点，使用外补丁margin负值的方法。负值的大小为层自身宽度高度除以二。如：一个层宽度是400，高度是300。使用绝对定位距离上部与左部都设置成50%。而margin-top的值为－150。margin-left的值为－200。这样我们就实现了层垂直居中于父级层的样式编写。 2、条件是div的高度和宽度是不固定的如果div宽度不固定，那用div就有点困难了，虽然用js获取当前高宽再附加css可以解决，但是要用到js来解决问题就有点逊了；我给你一个思路，你不妨试试table布局，table不设置宽度的情况下默认是宽度和高度都是最小化的，这样给table设置margin:0 auto就可以让这个table水平方向居中；解决了水平居中，那就来解决垂直居中，td中的内容默认是垂直居中的，那么只要两者互相嵌套一下不就解决水平垂直居中了! 但是有一个问题，你所需要垂直居中的父级table的高度是否固定，如果父级高度固定，那么子级高度不固定也一样可以垂直居中