这篇翻译不完整。请帮忙从英语翻译这篇文章

CSS text-decoration-skip 属性定义了元素哪些部分的内容需要被文本修饰所跳过。它可以控制所有该元素或该元素的祖先所绘制的文本修饰线。

/* 关键字 */
text-decoration-skip: none;
text-decoration-skip: objects;
text-decoration-skip: spaces;
text-decoration-skip: edges;
text-decoration-skip: box-decoration;

/* 使用多个关键字 */
text-decoration-skip: objects spaces;
text-decoration-skip: leading-spaces trailing-spaces;
text-decoration-skip: objects edges box-decoration;

/* 全局值 */
text-decoration-skip: inherit;
text-decoration-skip: initial;
text-decoration-skip: unset;

注意: ink 值被移动至 text-decoration-skip-ink 属性。

初始值objects
适用元素all elements
是否是继承属性yes
适用媒体visual
计算值as specified
Animation typediscrete
正规顺序order of appearance in the formal grammar of the values

语法

取值

none
没有任何内容被跳过。因此,文本修饰会为所有文本内容和行内元素进行绘制。
objects
拥有完整盒模型的原子行内元素会被跳过,例如图片和行内块元素。
spaces
所有的空格会被跳过,包括:所有的 Unicode 空白字符 和所有的分词符,以及任意相邻的 letter-spacing 或 word-spacing
leading-spaces
除了只跳过开始的空格外,与 spaces 相同。
trailing-spaces
除了只跳过结尾的空格外,与 spaces 相同。
edges
文本修饰的开始与结束会比原有的装饰范围向内收缩(例如半个线宽)。这样,相邻的元素的下划线就可以分开。(这对于中文很重要,因为在中文中,下划线也是一种形式的标点符号。)
An example of "text-decoration-skip: edges;".
box-decoration
文本修饰会跳过盒模型的内边距、边框、外边距。这只会影响到祖先元素定义的修饰;修饰的盒不会渲染本身的盒修饰。

语法格式

none | [ objects || [ spaces | [ leading-spaces || trailing-spaces ] ] || edges || box-decoration ]

示例

HTML

<p><em>Hey,</em> <em>grab a cup of coffee!</em></p>

CSS

p {
  margin: 0;
  font-size: 3em;
  text-decoration: underline;
  text-decoration-skip: edges;
}

结果

Specifications

Specification Status Comment
CSS Text Decoration Module Level 4
text-decoration-skip
Working Draft 首次定义

Browser Compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Basic support
Experimental
Chrome No support 57 — 64
Notes
No support 57 — 64
Notes
Notes Only supports the deprecated ink value.
Edge No support NoFirefox No support NoIE No support NoOpera No support 44 — 50
Notes
No support 44 — 50
Notes
Notes Only supports the deprecated ink value.
Safari Full support 8
Prefixed Notes
Full support 8
Prefixed Notes
Prefixed Requires the vendor prefix: -webkit-
Notes Only supports the none and skip values; all other values behave like those two values.
WebView Android No support 57 — 64
Notes
No support 57 — 64
Notes
Notes Only supports the deprecated ink value.
Chrome Android No support 57 — 64
Notes
No support 57 — 64
Notes
Notes Only supports the deprecated ink value.
Edge Mobile No support NoFirefox Android No support NoOpera Android No support 44 — 50
Notes
No support 44 — 50
Notes
Notes Only supports the deprecated ink value.
Safari iOS Full support 8
Prefixed Notes
Full support 8
Prefixed Notes
Prefixed Requires the vendor prefix: -webkit-
Notes Only supports the none and skip values; all other values behave like those two values.
Samsung Internet Android Full support 7.0

Legend

Full support  
Full support
No support  
No support
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
See implementation notes.
See implementation notes.
Requires a vendor prefix or different name for use.
Requires a vendor prefix or different name for use.

文档标签和贡献者

此页面的贡献者: allen0815
最后编辑者: allen0815,