gpt4 book ai didi

css - 在 HTML 中使用

隐藏表格的空行

转载 作者:太空宇宙 更新时间:2023-11-04 04:48:19 24 4
gpt4 key购买 nike

我想知道如何在 HTML 中隐藏一行。使用style="empty-cells : hide;"的CSS方法似乎有效,但如果 <h4>标签包含在空表中,则该行不隐藏。

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
</head>
<body>

<form name="form_simple" action=" " method="get">
<table border="1px" style="empty-cells : hide;">
<tr><td><h4>Empty cells should not have any borders around them</h4></td></tr>
<tr><td></td></tr>
<tr><td><h4>Empty cells should not have any borders around them.</h4></td></tr>
<tr><td><h4>Empty cells should not have any borders around them.</h4></td></tr>
</table>
</form>
</body>
</html>

style="empty-cells : hide;"适用于 <tr><td></td></tr> , 但不适用于 <tr><td><h4></h4></td></tr>

最佳答案

解决方法如下:

table td {
background-color:olive;
empty-cells:hide;
}
table td > *:empty {
display:none;
}

jsfiddle

如果您只想定位 h4,请将 * 更改为 h4

注意根据MDN , empty-cells 应该应用于 table-cell 元素,而不是 table (尽管浏览器似乎无论如何都接受它)。

关于css - 在 HTML 中使用 <h4> 隐藏表格的空行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13988029/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com