标签:ica ddl pre 居中 问题 sha 图片 ali 解决
一、问题
§. vertical-align middle 不生效的几种解决方式,图片居中几种方案
1.在父元素中增加display:table-cell,vertical-align 写在在父元素中
.btn{ display: table-cell; width: 200px; height: 200px; border: 1px solid #eee; text-align: center; vertical-align: middle; } .btn img{ width: 100px; } <div class="btn"> <img src="img/sh.png"> </div>
2.在父元素中增加空的span元素,并设置其高度为100%,vertical-middle居中 有效
.btn{ width: 200px; height: 200px; border: 1px solid #eee; text-align: center; } .btn span{ display: inline-block; vertical-align:middle; height: 100%; } .btn img{ width: 100px; vertical-align: middle; } <div class="btn"> <span></span> <img src="img/sh.png"> </div>
2. ul li 撑不起DIV
标签:ica ddl pre 居中 问题 sha 图片 ali 解决
原文地址:https://www.cnblogs.com/xdot/p/12936389.html