How to change the default background color white to something else in twitter bootstrap

Question

I am building a web application where I have set my default color to navy blue using css. But when i added the twitter bootstrap css's in my page I did not find my navy blue color instead I found the white background color provided by twitter bootstrap.

My query is that what portion of css should I change in bootstrap to change my page's background.

Answer 1

You can overwrite Bootstraps default CSS by adding your own rules.

<style type="text/css">    body { background: navy !important; } /* Adding !important forces the browser to overwrite the default style applied by Bootstrap */ </style> 

Answer 2

Bootstrap 4 provides standard methods for this, fully described here: https://getbootstrap.com/docs/4.3/getting-started/theming

Eg. you can override defaults simply by setting variables in the SASS file, where you import bootstrap. An example from the docs (which also answers the question):

// Your variable overrides $body-bg: #000; $body-color: #111;  // Bootstrap and its default variables @import "../node_modules/bootstrap/scss/bootstrap";