当前位置:   article > 正文

文字超出div后自动隐藏(可以自己调节显示行数)_vue div文字超出部分隐藏

vue div文字超出部分隐藏

我发现,在不固定父级元素(如div)高度之前,只要内部子类的东西一多就会将整个父级元素撑大,导致整个页面的布局被影响改变了,这并不是我们想要的效果。

那么怎么将一个子类里的文字超出后预先设定的范围后隐藏呢?

  1. .childrenClassName{
  2.   display: -webkit-box;
  3.   -webkit-box-orient: vertical;
  4.   -webkit-line-clamp: 2;
  5.   text-overflow: ellipsis;
  6.   height: 59px;
  7.   overflow: hidden;
  8.   margin: 0px;
  9. }
  10. /*childrenClassName 为子元素的类名*/
  11. /*height 可以通过调整这个参数的大小来修改想要显示的行数*/

childrenClassName 为子元素的类名 height 可以通过调整这个参数的大小来修改想要显示的行数 效果显示如下: 效果显示

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/2023面试高手/article/detail/91787
推荐阅读
相关标签
  

闽ICP备14008679号