Customize Boostrap

Hello!

I was wondering if there is anyway to change certain properties of default bootstrap. For instance: If I have a div=“card” it always displays with a border-radius which sometimes I don’t want.

How could I change this by only using HTML and CSS? Or is the idea to just give it a second class and change this one instead? Or create another div inside the div=“card” ?

Change it with a custom style sheet that has the exact same selector as the Bootstrap style sheet, and that loads last so it is lowest in the cascade an can override the latter.

bootstrap.css
custom.css

Do not alter bootstrap.css. Just copy the selector and paste it into your custom.css. Keep only the properties you change.

You could also extend the selector so that it only applies to certain elements.

.special .card {
    border-radius: 0;
 }
2 Likes