ranyonsue

css单行垂直居中,超过两行显示省略号

HTML:

<div>
     <span>单行居中,多行居左单行居中,多行居左</span>
</div>
<div>
     <span>单行居中</span>
</div>

 

CSS:

span {
font-size:14px;
overflow:hidden;
text-overflow:-o-ellipsis-lastline;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-line-clamp:2;
line-clamp:2;
-webkit-box-orient:vertical;
}
div {
border:1px solid red;
width:100px;
height:60px;
display:flex;
align-items:center;
margin-top:1rem;
}

 

分类:

技术点:

相关文章:

  • 2021-11-19
  • 2022-12-23
  • 2022-02-17
  • 2021-12-15
  • 2021-09-03
  • 2021-11-19
  • 2022-12-23
  • 2022-12-23
猜你喜欢
  • 2021-09-23
  • 2021-12-15
  • 2021-11-19
  • 2021-05-20
  • 2021-12-25
  • 2022-01-12
相关资源
相似解决方案