Especificidad CSS con bootstrap

Question

Estoy tratando de entender la especificidad de CSS.Lo que quiero lograr es tener los Basics.css para tener la más alta especificidad para que sea lo que sea, sobrescribirá completamente el CSS de Bootstrap, incluso si es el mismo selector.

¿Cómo puedo pedir mis archivos aquí para lograr esto?

@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

La Última CSS sobrescribe el primero css llamado.

Entonces, para hacer esto, le recomendaría que llame primero el CSS menos importante y dure el más importante .

En este caso, llamaría el primer bootstrap.css y el último basics.css

Editar:
Algo así como este

@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");