『总结』CSS/CSS3常用样式与web移动端资源

css/css3常用样式

强制文本显示

单行显示语法:white-space:nowrap;
让一段文字在固定宽度在一行显示,最后一个字符为省略标记(…),css样式如下

div{
  white-space:nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
}

多行文本最后省略号:

div{
  display: -webkit-box; 
  -webkit-line-clamp:2;
  overflow: hidden; 
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

这里用到了文本溢出显示省略号的,即设置溢出文本显示为省略标记:

语法:text-overflow:text-overflow:clip | ellipsis | ellipsis-word(css3新增加的);

  1. clip:表示直接裁切溢出的文本;

  2. ellipsis:表示文本溢出时,显示省略标记(…),省略标记代替最后一个字符;

  3. ellipsis-word:表示文本溢出时,也是显示省略标记(…),不同的是,省略标记代替的是最后一个词)

陆续添加用到的内容…

    原文作者:前端笔记屋
    原文地址: https://segmentfault.com/a/1190000011076812
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞