溢出包装 | overflow-wrap (Text) - CSS 中文开发手册 - Break易站


  • ??CSS 中文开发手册

    溢出包装 | overflow-wrap (Text) - CSS 中文开发手册

    该overflow-wrapCSS属性指定浏览器是否应该向语句中插入换行符,以防止文本溢出其内容框。与word-break相反,如果整个单词不能在没有溢出的情况下放在自己的行上,overflow-wrap只会创建一个中断。

    /* Keyword values */
    overflow-wrap: normal;
    overflow-wrap: break-word;
    
    /* Global values */
    overflow-wrap: inherit;
    overflow-wrap: initial;
    overflow-wrap: unset;

    该属性最初是一个非标准的,没有前缀的微软扩展word-wrap,并被大多数具浏览器实现。现在,它已经被重新命名为overflow-wrap,而word-wrap则作为该属性的一个别名。

    Initial value

    normal

    Applies to

    all elements

    Inherited

    yes

    Media

    visual

    Computed value

    as specified

    Animation type

    discrete

    Canonical order

    the unique non-ambiguous order defined by the formal grammar

    语法

    该overflow-wrap属性被指定为下面的列表中的任一个关键字值。

    可能值

    normal——行只能在正常的单词断点处(如两个单词之间的空格)断开。

    break-word——为了防止溢出,如果在行中没有其他可接受的断点,通常不能破坏的语句也可能会在任意点被断开。

    形式语法

    normal | break-word

    实例

    CSS

    .normal {
    ? width: 13em;
    ? background: gold;
    }
    .break-word {
    ? width: 13em;
    ? background: lime;
    ? overflow-wrap: break-word;
    }

    HTML

    <p class="normal">FStrPrivFin?ndG (Gesetz zur ?nderung des
      Fernstra?enbauprivatfinanzierungsgesetzes
      und stra?enverkehrsrechtlicher Vorschriften)</p>
    <p class="break-word">FStrPrivFin?ndG (Gesetz zur ?nderung des
      Fernstra?enbauprivatfinanzierungsgesetzes
      und stra?enverkehrsrechtlicher Vorschriften)</p>

    结果

    规范

    Specification

    Status

    Comment

    CSS Text Module Level 3The definition of ‘overflow-wrap‘ in that specification.

    Working Draft

    Initial definition

    浏览器兼容性

    Feature

    Firefox (Gecko)

    Chrome

    Edge

    Internet Explorer

    Opera

    Safari

    Basic support (as word-wrap)

    3.5 (1.9.1)

    1.0

    (Yes)

    5.5

    10.5

    1.0

    overflow-wrap

    49 (49)

    (Yes)

    No support

    ?

    (Yes)

    (Yes)

    Feature

    Firefox Mobile (Gecko)

    Android

    Edge

    IE Mobile

    Opera Mobile

    Safari Mobile

    Basic support (as word-wrap)

    1.0 (1.9.1)

    1.0

    (Yes)

    ?

    ?

    1.0

    overflow-wrap

    49 (49)

    (Yes)

    No support

    ?

    (Yes)

    (Yes)

    
    
  • ??CSS 中文开发手册
  • 转载请保留页面地址:https://www.breakyizhan.com/css/32109.html

    溢出包装 | overflow-wrap (Text) - CSS 中文开发手册 - Break易站

    上一篇:滚动界限终点 | scroll-snap-destination (Scroll Snap) - CSS 中文开发手册 - Break易站


    下一篇:简单的ajax加载,不需要解密的明文类型