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

CSS中 empty-cells 属性定义了用户端 user agent 应该怎么来渲染表格 <table> 中没有可见内容的单元格的边框和背景。

/* Keyword values */
empty-cells: show;
empty-cells: hide;

/* Global values */
empty-cells: inherit;
empty-cells: initial;
empty-cells: unset;

只有当 border-collapse 属性值是 separate 时,才会生效。

初始值show
适用元素table-cell elements
是否是继承属性yes
适用媒体visual
计算值as specified
Animation typediscrete
正规顺序the unique non-ambiguous order defined by the formal grammar

语法

empty-cells 的属性值必须是以下取值中的一个。

取值

show
边框和背景正常渲染。与普通元素一样。
hide
边框和背景被隐藏。

语法形式

show | hide

示例

HTML

<table class="table_1">
  <tr>
    <td>Moe</td>
    <td>Larry</td>
  </tr>
  <tr>
    <td>Curly</td>
    <td></td>
  </tr>
</table>
<br>
<table class="table_2">
  <tr>
    <td>Moe</td>
    <td>Larry</td>
  </tr>
  <tr>
    <td>Curly</td>
    <td></td>
  </tr>
</table>

CSS

.table_1 {
  empty-cells: show;
}

.table_2 {
  empty-cells: hide;
}

td,
th {
  border: 1px solid gray;
  padding: 0.5rem;
}

Result

规范

Specification Status Comment
CSS Level 2 (Revision 1)
empty-cells
Recommendation Initial definition.

浏览器兼容性

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Basic supportChrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 8Opera Full support 4Safari Full support 1.2WebView Android Full support 1Chrome Android ? Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support 6Safari iOS Full support 3.1Samsung Internet Android ?

Legend

Full support  
Full support
Compatibility unknown  
Compatibility unknown

文档标签和贡献者

标签: 
此页面的贡献者: alongite
最后编辑者: alongite,