如何指定具有两个相等类的CSS父级
如何指定具有两个相等类的CSS父级
提问于 2018-07-13 09:24:03
我有一个网站，当菜单打开时，将类添加到body标签中。有右菜单和左菜单。当两者都打开时，会导致我的中心列出现一些宽度问题。我正在尝试获得一个父类，它的功能如下所示：
当body标记中有left-menu和right-menu类时，我想要更改central column。
我不能让它工作，因为左菜单和右菜单在同一父级，它们不是嵌套的。因此，当我指定了两个类时，它会失败，因为我找不到一种方法来指定两个相等的和不在级联中的东西。
.left-menu .right-menu .central-column {margin: 0 !important;}这不起作用，但我可以指定其中一个菜单何时打开，例如，这些菜单都起作用：
.left-menu .central-column,
.right-menu .central-column {margin: 0 !important;}我尝试过这样的方法，但都不起作用。
.left-menu .right-menu {.central-column {margin: 0 !important;}}
.left-menu & .right-menu .central-column {margin: 0 !important;}
body[class="left-menu"][class="right-menu"] .central-column {margin: 0 !important;}
body[attr="left-menu"][class="right-menu"] .central-column {margin: 0 !important;}有人能帮上忙吗？
回答 2
Stack Overflow用户
发布于 2018-07-13 09:33:57
当类在同一元素上时，您需要组合选择器。例如：
<body class="left-menu right-menu">然后，当这些类一起出现时，为了让您的.central-column受到影响，您需要像.left-menu.right-menu一样组合CSS上的选择器(注意，类之间没有空格)。
.left-menu.right-menu .central-column {
margin: 0 !important;
}请参阅文档，Class Selectors
Stack Overflow用户
发布于 2018-07-13 09:43:24
如果我没理解错的话，右菜单和左菜单在同一层，但是中间的列嵌套在它们下面。
在这种情况下，您要做的就是编写
.left-menu.right-menu .central-column 通过在.left-menu后面留一个空格，您编写的下一个类将被解释为“任何带有类left-menu的元素的子级，并且包含这个类”。但是由于没有空间，您选择的是同时包含两个类的所有内容。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51316486
复制相关文章
相似问题
腾讯云开发者
