为什么jQuery没有应用边框样式?

时间:2013-07-01 08:22:02

标签: jquery css

我想知道为什么在应用addCLass方法时JQuery没有应用border-bottom css属性。它应用颜色但不应用边框。这是为什么? JSFiddle:http://jsfiddle.net/egh7a/

感谢。

HTML

<section class="news">
    <article>one</article>
    <article>two</article>
    <article>three</article>
    <article>four</article>
</section>

的jQuery

$(".news article:last").addClass("two");

CSS

.news {
   border-top: 1px solid #777;
}

.news article {
   padding-top: 10px;
   padding-bottom; 10px;
   border-bottom: 1px dashed #999;
}

.two {
   color: red;
   border-bottom: black solid 2px; 
}

2 个答案:

答案 0 :(得分:5)

文章项从更具体的css规则中获取其样式。

在这种情况下,.news article.two更具体。

请尝试将.two课改为.news .two

答案 1 :(得分:2)

因为新的border样式不是覆盖最后一个样式。您可以使用!important 覆盖

.two {
  color: red;
  border-bottom: black solid 2px !important; 
}

JSFiddle