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

标签 html css

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

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

我有这些 css 规则:

ul {
    padding: 5px;
}

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

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

当我的 html 中只声明了一个 li 时,如何隐藏 both ulli

最佳答案

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

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

关于html - 当 ul 只有一个 li 标签时隐藏 ul 和 li 标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52394111/

相关文章:

javascript - jQuery slider 图像向下移动

javascript - 将类添加到选定的单选按钮

html - 无法正确定位页眉

javascript - 使用深层链接的 ng bootstrap 下拉菜单样式

javascript - 将 HTML/CSS 元素转换为可重用的 AngularJS 指令?

html - 关于 ActionLinks 和普通 a-tag 超链接的小 MVC 样式问题

javascript - 防止掉落的元素落入已掉落的元素中

html - 超链接点击时的修饰键行为

html - 使表单输入标签后剩余内容的 100% 宽度

css - 如何根据变量的输出在我的 React 网络应用程序中设置组件的宽度