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

2021-01-27 11:13

阅读:491


  • ??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

    FStrPrivFin?ndG (Gesetz zur ?nderung des Fernstra?enbauprivatfinanzierungsgesetzes und stra?enverkehrsrechtlicher Vorschriften)

    FStrPrivFin?ndG (Gesetz zur ?nderung des Fernstra?enbauprivatfinanzierungsgesetzes und stra?enverkehrsrechtlicher Vorschriften)

    结果

    规范

    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 中文开发手册

  • 评论


    亲,登录后才可以留言!