本文探讨了如何使用CSS实现元素的垂直居中对齐，特别是当涉及label1、icon和label2的对齐时。通过设置相对定位、inline-block和absolute定位，可以轻松实现label1与icon的垂直居中，以及label2与icon中线对齐。此外，还提到了使用flexbox布局和transform属性的解决方案。
label1与icon垂直居中对齐，label2的顶部与icon的中线对齐
回答：
思路还是挺简单的，前面俩比较容易对齐，第三个用绝对定位，top：50%就可以搞定
.wrap{
position: relative;
font-size: 20px;
width: 500px;
height: 50px;
background: #ddd;
}
.lable1{
background: #ccc;
display: inline-block;
width: 50px;
height: 100%;
}
.radio{
display: inline-block;
line-height: 50px;
height: 50px;
margin: 0;
}
.lable2{
position: absolute;
background: #999;
display: inline-block;
width: 50px;
height: 100%;
top: 50%;
}
回答：
flex 或 box布局，三个全部居中对齐，然后label2 再transform:translate(0%,50%)
回答：
这不简单嘛,让label1跟icon中线对齐,然后让laybel2往下偏移label1的高度的一半;
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
