对于任意元素的水平及垂直居中的问题思考

CSS实现

(1)flex布局,ie9+,移动端ios6+、android4+

(2)position定位结合calc函数或者transform:translate(-50%; -50%),ie9+,移动端ios6+、android5+

(3)父类table,子类 cell-table和vertical-align: center,ie8+

(4)使用一个空标签span设置他的vertical-align基准线为中间,并且让他为inline-block,宽度为0,加上*display:inline-block,ie6+

JS实现

  采用offsetWidth和offsetHeight获取元素宽高然后可以使用position定位到中间

发布了4 篇原创文章 · 获赞 3 · 访问量 824

猜你喜欢

转载自blog.csdn.net/weixin_41484544/article/details/88431491