CSS 图片水平垂直居中于DIV
对于前端工作人员，可能都会碰到要把一个图片垂直居中于一个父元素，当我们不知道它的高度时，应该如何去处理呢 ，我把我整理过的一个DEMO 上传和大家分享，有什么问题可以 互相交流和讨论。 不一定来说我的方法就是最好的，如果有更好的方式 ，互相分享一下。
CSS部分
| .zxx_align_box_4 li{float:left; margin-right:13px;} .zxx_align_box_4 li div{display:table-cell; width:200px; height:200px; border:1px solid #beceeb; *font-size:174px; text-align:center; vertical-align:middle; line-height:200px; } .zxx_align_box_4 li div img{vertical-align:middle;} |
HTML部分
| <ul class="zxx_align_box_4 clearfix"> <li> <div> <img src="../img/t1.jpg" /></div> </li> <li> <div> <img src="../img/t2.jpg" /></div> </li> <li> <div><img src="http://image.zhangxinxu.com/image/study/s/s128/mm3.jpg"></div> </li> <li> <div><img src="http://image.zhangxinxu.com/image/study/s/s128/mm4.jpg"></div> </li> </ul> |
相关推荐
PioneerFan 2020-06-10
HSdiana 2020-03-28
FZfeng 2018-04-04
Ivy 2016-08-14
drdrsky 2020-06-16
冰蝶 2020-06-05
heavenautumn 2020-05-11
sdbxpjzq 2020-05-04
guojiadonglian 2020-04-24
lcyangcss 2020-04-21
葉無聞 2020-03-23
lyg0 2020-03-07
wcssdu 2020-01-11
冰蝶 2020-01-10