用类覆盖li样式

Question

在我的网站上我创建了这个html / css

li
{
    float: left;
    ...
}

.myclass
{
    float: right;
    ...
}

<ul>
    <li>test 1</li>
    <li class="myclass">test 2</li>
</ul>

两个列表元素具有相同的样式，但第二个不使用该类来覆盖左浮点数。为什么呢？

修改 似乎如果我使用

li.myclass
{
    float: right;
    ...
}

它有效，但我也在div中使用myclass，因为它是一个常见的样式类。如何在不使用li的情况下解决问题。

Answer 1

正如您的帖子所说，如果您使用更具“特定”的选择器（例如float），则可以覆盖li.myclass - 属性。因此，您可以在逗号分隔的列表中列出两个选择器。

.myclass, li.myclass {
    float: right;
}

或者您可以使用!important覆盖该属性。

.myclass {
    float: right !important;
}

此外，它还会在CSS中显示属性的位置。位于文件下方的属性可以覆盖上面的属性。

Answer 2

根据你的评论，我认为你应该使用一张桌子，因为它看起来非常像一个人。只要他们不习惯设计工作，表格就不是邪恶的。

或者如果你真的想避免使用表格，只需要做两个列表并将's与float对齐。