html - 当 ul 只有一个 li 标签时隐藏 ul 和 li 标签

Question

请不要将此问题与 stackoverflow 上发布的其他问题混淆。

注:Hide list with one element with pure CSS我的问题涉及父标签。

我有这些 css 规则:

ul {
    padding: 5px;
}

ul > li:only-child {
    display: none;
}

此规则隐藏第一个 ul 标记(当它是唯一的标记时)。但是 ul 标签的空格还在。

当我的 html 中只声明了一个 li 时，如何隐藏 both ul 和 li？

Answer 1

即使在隐藏 li 元素后，您看到的额外间距是因为您为父 ul 元素包含了一个 padding。

所以解决方案是从 ul 元素中删除填充并将其应用于子 li 元素。