如何覆盖CSS类

Question

我有一个由Drupal生成的网页,它附带了一个特定的样式表.

我想覆盖其中一种风格.它设置为这样的类:

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

因此,我不想使用Drupal CSS附带的".description"样式,而是希望页面使用我的".description"样式.换句话说 - 如果页面有2个".description"样式,我该如何告诉页面使用我的？

Answer 1

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

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

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

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

3. 不要用!important.只是不要.

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