html - css vertical-align 属性值为middle

查看：128 发布时间：2017/9/5 20:22:02 html css

本文介绍了html - css vertical-align 属性值为middle的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题

属性的描述：vertical-align:middle：元素的中垂点与父元素的基线加1/2父元素中字母x的高度对齐。

疑惑：这个属性值想要描述的到底是什么？元素的中垂点对齐父元素（基线+1/2字母'x'）的高度？

实验代码
1.html部分：

<div class="box1">
    xph
    <img src="img/880374243715778.jpg" />
    <span>span</span>
</div>
<div class="box2"></div>

2.css部分

.box1{background-color:pink;}
.box2{
    border-bottom: 1px solid blue;
    position:absolute;
    top:44px;
    width:100%;
}

结果：

蓝色的线的图片（90*90）的中垂点，这个结果和基线+1/2的字母'x'有什么关系啊？（头有点痛，先去洗澡了）

解决方案

这样写理解了没？

这篇关于html - css vertical-align 属性值为middle的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文