Specificità CSS con bootstrap

Question

Sto cercando di capire la specificità CSS.Quello che voglio ottenere è avere le basi.CSS per avere la massima specificità in modo che qualunque cosa sia lì sovrascriverà completamente il bootstrap css, anche se è lo stesso selettore.

Come posso ordinare i miei file qui per ottenere questo?

@import url("common.css");
@import url("links.css");
@import url("content.css");
@import url("colours.css");
@import url("basics.css");
@import url("/bootstrap/css/bootstrap.css");
@import url("/bootstrap/css/bootstrap-responsive.css");
@import url("/bootstrap/css/bootstrap-select.min.css");
@import url("/footable/css/footable.core.min.css");
@import url("/font-awesome/css/font-awesome.css");
@import url("/iconmoon/style.css");

.

Answer 1

Il Ultimo CSS sovrascrive il First CSS chiamato.

Allora, per fare questo, ti consiglierei di Chiamare prima il minimo IMPORTANTE CSS e Ultimo il più importante .

In questo caso, chiameresti il primo bootstrap.css e l'ultimo basics.css

Modifica:

Qualcosa come questo

@import url("/bootstrap/css/bootstrap.css");
@import url("/bootstrap/css/bootstrap-responsive.css");
@import url("/bootstrap/css/bootstrap-select.min.css");
@import url("/footable/css/footable.core.min.css");
@import url("/font-awesome/css/font-awesome.css");
@import url("/iconmoon/style.css");
@import url("common.css");  
@import url("links.css");
@import url("content.css");
@import url("colours.css");
@import url("basics.css");

.