覆盖CSS属性

我有2个文件theme.css和main.css覆盖CSS属性

theme.css

.table td { 
      border-top: 1px solid #e8edf1; 
      vertical-align: top; 
      padding: 5px 5px !important; 
      color: #576475; 
      font-size: 11px; 
}

的main.css

.table td { 
      padding: 1px 2px; 
}

我想通过main.css覆盖的td财产在之后包括。

但是最终产量需要theme.css的财产。

PS：我想只覆盖填充属性。

来源

2017-01-09 Abhishek

加上'填充：1px的2px的重要;' – Raviteja

没有直接关系的问题，但是我希望一个main.css的来theme.css之前，因为第一声音更通用和主题是可以轻易替换的。 –

因为第一CSS规则已申请!important，来覆盖它使用另一个!important规则的唯一途径：

.table td { 
    padding: 1px 2px !important; 
}

如果可以的话，从你所有的CSS删除!important关键字。有更好的方法来定义订单。

来源

2017-01-09 11:14:25

谢谢..它的工作.. – Abhishek

就具体情况而言，!important每次都获胜。

你真的应该避免使用!important并使用特定的优点。订购CSS文件是实现它的一种方式，订购您的规则是另一种方式。

更多关于特异性：CSS-Tricks

所以，你的情况，你应该从你theme.css文件中删除!important标志，这将解决这个问题。

来源

2017-01-09 11:15:09

@Abhishek请根据您的要求，使用两个不同表格的示例检查以下代码。

table td { 
 
      border-top: 1px solid #e8edf1; 
 
      vertical-align: top; 
 
      padding: 5px 5px !important; 
 
      color: #576475; 
 
      font-size: 11px; 
 
} 
 

 
table.custom_table td{ 
 
    padding: 1px 2px !important; 
 
}

<table> 
 
     <tr> 
 
      <td>fdhf</td> 
 
      <td>dfdfdf</td> 
 
      </tr> 
 
       
 
    
 
</table> 
 
<table class="custom_table"> 
 
     <tr> 
 
      <td>fdhf</td> 
 
      <td>dfdfdf</td> 
 
      </tr> 
 
       
 
    
 
</table>

来源

2017-01-09 11:21:02 sanjay

这更像是一个游戏的点差异比答案。你改变了什么？它为什么解决这个问题？ – Quentin

回答

相关问题