CSS - empty-cells 属性

CSS empty-cells 属性用于控制表格中没有内容或被认为是“空”的单元格的渲染方式。它仅适用于表格和表格单元格。

语法

empty-cells: show | hide | initial | inherit;

属性值

值	描述
show	在空单元格上显示边框。默认值。
hide	在空单元格上隐藏边框。
initial	将属性设置为其默认值。
inherit	从父元素继承该属性。

CSS 空单元格属性示例

以下示例说明了使用不同值的 empty-cells 属性。

带有边框的空表格单元格

要使表格的空单元格具有边框，我们使用 show 值，它是默认值。这在以下示例中显示。

示例

<!DOCTYPE html>
<html>

<head>
   <style>
      table {
         padding: 4px;
         empty-cells: show;
      }
   </style>
</head>

<body>
   <h2>
      CSS empty-cells property
   </h2>
   <h4>
      empty-cell: show ( see the places 
      without values have borders)
   </h4>
   <table border=1 cellpadding=30>
      <tr>
         <td>
            1
         </td>
         <td>
            2
         </td>
         <td>
         </td>
      </tr>
      <tr>
         <td>
            4
         </td>
         <td>
         </td>
         <td>
            6
         </td>
      </tr>
      <tr>
         <td>
         </td>
         <td>
            8
         </td>
         <td>
            9
         </td>
      </tr>
   </table>

</body>

</html>

没有边框的空表格单元格

要使表格的空单元格不具有边框，我们使用 hide 值。这在以下示例中显示。

示例

<!DOCTYPE html>
<html>

<head>
   <style>
      table {
         padding: 4px;
         empty-cells: hide;
      }
   </style>
</head>

<body>
   <h2>
      CSS empty-cells property
   </h2>
   <h4>
      empty-cell: hide ( see the places without
      values do not have borders)
   </h4>
   <table border=1 cellpadding=30>
      <tr>
         <td>
            1
         </td>
         <td>
            2
         </td>
         <td>
         </td>
      </tr>
      <tr>
         <td>
            4
         </td>
         <td>
         </td>
         <td>
            6
         </td>
      </tr>
      <tr>
         <td>
         </td>
         <td>
            8
         </td>
         <td>
            9
         </td>
      </tr>
   </table>

</body>

</html>

支持的浏览器

属性
empty-cells	1.0	8.0	1.0	1.2	4.0

css_properties_reference.htm

打印页面