两个style.css是冲突的

Question

我有主要的style.css和第三方提供的

// Include main CSS
<link charset="utf-8" media="screen" type="text/css" href="http://test.style-hunters.ru/wp-content/themes/style-hunters/style.css" rel="stylesheet">

// Include third party CSS, we have put it to css folder
<link href="http://test.style-hunters.ru/wp-content/themes/style-hunters/css/style.css" rel="stylesheet"> 

在第二个style.css中

body {
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
  margin: 0;
  padding: 20px;
}

这使得所有body元素都有填充.

怎么解决？

Answer 1

首先包含第三方CSS文件,以便您可以在自己的文件中覆盖不需要的规则.

Answer 2

你有三个不错的选择,其中两个被提到:

1:使用!important标志.这是最不可取的,因为你永远会覆盖填充规则 - 如果页面需要覆盖它怎么办？

body { 
    padding: 0 !important; 
}

2:翻转订单; 把第三方样式表放在第一位.

3:使用html标签:

html > body { 
    padding: 0; 
} 
/* OR */ 
html body { 
    padding: 0; 
}

如果您不关心IE6,请使用第一个,如果您这样做,请使用第二个.