在高度固定，实现文本一行或两行文本垂直对齐
- 把外框高度设置为两行(几行对齐就几行)的最大高度。
<style type="text/css">
.infos{
width: 100%;
max-width:400px;
height:auto;
overflow: hidden;
background: #000;
color:#fff;
display:table;
}
.icon{display:table-cell;
width: 50px;
height: 72px;
background: green;
vertical-align: middle;
}
.txt{
display:table-cell;
overflow: hidden;
vertical-align: middle;
}
.txt p{
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
vertical-align: middle;
overflow: hidden;
line-height: 20px;}
</style>
<body>
<div class="infos">
<div class="icon"></div>
<div class="txt"><p>文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字</p></div>
</div>
</body>
image.png
网友评论