zoukankan      html  css  js  c++  java
  • 换行、文字隐藏省略号问题

    1、一行超出文字隐藏

    overflow: hidden;   /*自动隐藏文字*/
    text-overflow: ellipsis;   /*文字隐藏后添加省略号*/
    white-space: nowrap;   /*强制不换行*/

    2、div显示两行文字,超出两行部分省略号显示

    overflow: hidden;
    text-overflow: ellipsis;
    text-overflow: -o-ellipsis-lastline;
    display: -webkit-box;
    -webkit-line-clamp: 2;    /* 限制行数 */
    -webkit-box-orient: vertical;

    3、white-space属性可设置不换行

    描述
     normal  默认。空白会被浏览器忽略。
     pre  空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
     nowrap  文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
     pre-wrap  保留空白符序列,但是正常地进行换行。
     pre-line  合并空白符序列,但是保留换行符。
     inherit  规定应该从父元素继承 white-space 属性的值。

    4、word-break属性设置自动换行的处理方法

    描述
     normal  使用浏览器默认的换行规则。
     break-all  允许在单词内换行(解决长单词或url地址换行显示)
     keep-all  只能在半角空格或连字符处换行。
  • 相关阅读:
    Centos 7 安装shellcheck
    cunit环境搭建
    flex序列号和破解
    windows下python SSH-Client模块paramiko的安装与修改
    history优化设置
    shell配置和vim配置
    testlink 安装方法
    python解析GBK格式xml文件
    运用Loadrunner测试Mysql数据库性能 TRON•极客
    写python用到的一些大杀器
  • 原文地址:https://www.cnblogs.com/ccyinghua/p/7944836.html
Copyright © 2011-2022 走看看