如何覆盖CSS类 [英] How to override a CSS class

问题描述

我有一个由Drupal生成的网页，并附有特定的样式表.

I have a webpage that is generated by Drupal and it comes with a certain stylesheet attached to it.

我想覆盖其中一种样式.它是用这样的类设置的:

I would like to override one of the styles. It is set with a class like this:

<div class="description"></div>

因此，我希望页面使用我的".description"样式，而不是使用Drupal CSS随附的".description"样式.换句话说-如果页面具有2种".description"样式，我如何告诉页面使用我的样式?

So instead of using the ".description" style that comes with the Drupal CSS, I would like the page to use my ".description" style. In other words - if the page has 2 ".description" styles, how do I tell the page to use mine?

推荐答案

1. 使用具有更高特异性的选择器:

div.description {
    /* will take precedence over just .description */
}

将样式表放置在要覆盖的样式表之后:

Place your stylesheet after the one you want to override:

/* Drupal's style */
.description {
    foo: bar;
}

/* Your style */
.description {
    foo: baz; /* takes precedence over foo: bar */
}

请勿使用！important .请勿使用.

Do not use !important. Just don't.

另请参见 CSS 3:计算选择器特异性.

这篇关于如何覆盖CSS类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！