美文网首页
超出两行出现省略号vue项目上线后失效

超出两行出现省略号vue项目上线后失效

作者: 拾钱运 | 来源:发表于2019-05-28 21:50 被阅读0次

本地好好的,一上线就挂了,大坑,有一个css属性死活不出来,这个属性如下写就行了

/*! autoprefixer: off */
    -webkit-box-orient: vertical;
 /* autoprefixer: on */

两行超出省略号,一行文字居中问题

//html结构
<div>
      <p>
            <span>超出两行省略,一行居中</span>
      </p>
</div>
//css
<style>
div{
    width:100px;
    height:50px;
    display:flex;
   align-items:center;
}
p{
  display:inline-block
}
span{
      overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    display: -webkit-box;
}
</style>

相关文章

网友评论

      本文标题:超出两行出现省略号vue项目上线后失效

      本文链接:https://www.haomeiwen.com/subject/hggjtctx.html