css - 样式嵌套 UL 具有相同的类

标签 css nested html-lists

我有一个嵌套列表,但我在设置最后一级 UL 的样式时遇到了问题。

<ul class="same-class">
    <li>
        <ul class="same-class">
            <li>
            </li>
        </ul>
    </li>
</ul>

我需要的是内联显示第一个 UL 元素,并在它们下面将它们的 child 显示为 block 。问题是两个 UL 具有相同的类(我不能更改 HTML 输出,也不能添加类),而且我找不到合适的选择器来定位第二个 UL。

In the example here我尝试向菜单 3 和 4 添加一个不同的类,这就成功了,但由于更改类不是一个选项,我需要找到一种解决方法来使子项显示为 block 。

有人可以看看并提出建议吗?

最佳答案

ul ul li { 显示: block ; }.same-class .same-class li { display: block; } 应该可以解决这个问题 - 这将选择所有 li 是两个或多个 ul.same-class 的 child >

This might be useful (attribute selectors)取决于你的真实代码是什么样的(如果你使用的是 AngularJS 或类似的东西,很可能有用)或 the nth-child might be good too因为我不是 100% 确定你的意思。

希望这对您有所帮助!

关于css - 样式嵌套 UL 具有相同的类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25436751/

相关文章:

ruby-on-rails - 如何从父模型创建子模型

html - 自定义 ul li,将元素符号居中对齐(作为文本)?

html - 在本地存储中存储列表

html - 将鼠标悬停在 li 上时如何更改所有字体颜色

html - 如何在CSS中均匀分配?

CSS3 动画在 Firefox 中不起作用

php - 如何从对象的数组记录集中获取嵌套的 HTML 列表?

r - 嵌套 ifelse 语句

javascript - AngularJS 的 CSS 偏移增量

jquery - django: Bootstrap 菜单不会在移动设备上折叠