如何使用类CSS覆盖内联CSS?

时间:2016-02-05 03:05:19

标签: javascript jquery css

我正在使用jQuery追加一个元素,例如:

var mytop=100;
$(this).appendTo('.container')
       .last()
       .wrap('<div class="action" style="top:' + mytop + 'px;"></div>');

mytop是计算出的数字。由于新元素具有类action,因此稍后应通过添加类moveup来更改顶部,例如:

$('document').on('click', function(e){
   if($(e.target).hasClass('action')){
      $(this).addClass('moveup');
   }
});

将CSS作为:

.moveup{
   top:5px;
}

问题是,附加的<div>的内联CSS会覆盖类的CSS。单击此新创建的项目时,其顶部应设置为5px。

如何使用Class的CSS覆盖内联CSS?

1 个答案:

答案 0 :(得分:3)

取自https://css-tricks.com/snippets/css/style-override-technique/

  

值末尾的!important规则将覆盖该属性的任何其他样式声明,包括内联样式。

p { 
    font-size: 24px !important; 
}