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!