Menu
I know basic CSS, but I'm not experienced. I want to use bootstrap's CSS file, but I want to add my own style codes too. What should I do for that? Should I add Bootstrap styles first and then mine? Is that the best way?
408
Yes. You will want to put your additions in a separate file and link it below the bootstrap. css link. Then you can add your own classes and/or overwrite the Bootstrap classes in your own file.
You can override the default styles of Bootstrap elements using two possible methods. The first way — using CSS overrides— applies to sites using BootstrapCDN or the pre-compiled versions of Bootstrap. The second — using Sass variables — applies to sites using the source code version of Bootstrap.
I would suggest to use combination of both. For most of the things like responsiveness, menu, tabs, buttons, forms you will get what you want with bootstrap. So don't need to re-invent the wheel. Now there are things that are not part of bootstrap and you will have to write custom CSS for it.
You will have the stylesheets order like this, first you will include bootstrap css, then your stylesheet file. Why is that? Because that way you can overwrite the classes from the framework without using !important. You can write your own classes and include them in your layout, you can use bootstrap classes and make adjustments to them as you need. When you mix your classes and bootstrap classes check what attributes are added from their classes, do you need them or not etc...
Example
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"/> <style> /* Your external css file will go here. This is just for testing :) */ .mycustombtn{ background: #000; } </style> <button type="button" class="btn btn-danger mycustombtn">Danger</button>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
