Home > Article > Web Front-end > How to use css empty-cells attribute
How to use css empty-cells attribute
- 青灯夜游Original
- 2019-05-28 17:16:422658browse
css empty-cells property is used to set whether to display empty cells in the table (only for "detached border" mode). This property defines how a table cell containing no content is represented; if displayed, the cell's border and background are drawn.
How to use the css empty-cells attribute?
empty-cells property sets whether to display empty cells in the table (only for "detached border" mode).
Syntax:
empty-cells:hide|show|inherit;
Property values:
hide: Do not draw borders around empty cells.
show: Draw a border around empty cells. default.
inherit: Specifies that the value of the empty-cells attribute should be inherited from the parent element.
Description: This attribute defines how table cells that do not contain any content are represented. If displayed, the cell's borders and background are drawn. This property is ignored unless border-collapse is set to separate, i.e. in "separate border" mode.
Note: All browsers support the empty-cells attribute. Internet Explorer 8 (and later) supports the empty-cells attribute if !DOCTYPE is specified, some versions of IE do not support this attribute.
css empty-cells attribute example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
table
{
border-collapse:separate;
empty-cells:hide;
}
</style>
</head>
<body>
<table border="1">
<tr>
<td>Peter</td>
<td>Griffin</td>
</tr>
<tr>
<td>Lois</td>
<td></td>
</tr>
</table>
</body>
</html>Rendering:
The above is the detailed content of How to use css empty-cells attribute. For more information, please follow other related articles on the PHP Chinese website!