This question already has answers here:
How can I override Bootstrap CSS styles?
(14 answers)
Customizing Bootstrap CSS template
(9 answers)
Closed 4 years ago.
I worked with bootstrap many times and usually I'am creating other style file where I'am overwriting bootstrap classes. I think it's better way to do this. I am also get annoying when I have too much code which I actually don't use in bootstrap source.
What's the best way to overwriting bootstrap classes and remove this parts of code which actually is not needed from bootstrap sources?
One very common way is to use the Boostrap Sass implementation and set variables to define many of the styles. This prevents many css 'overrides' and usually results in much less css code.
You can also pick and choose which Bootstrap components to include (via #import) in the compiled css:
https://getbootstrap.com/docs/4.0/getting-started/theming/#importing
https://getbootstrap.com/docs/4.0/getting-started/theming/
Related
This question already has answers here:
Customizing Bootstrap CSS template
(9 answers)
Closed 3 years ago.
I need to use just some parts of bootstrap 4, not all of that. and I want to use my customize bootstrap in my wordpress theme and sell it on Themeforest store or somewhere, I dont want to use bootstrap.js and many parts of bootstrap.css.
I want to use these items ...
reset css
Print media styles
Grid system
Responsive utilities
Navbar
Breadcrumbs
Responsive embed
can I copy/paste my ideal parts of bootstrap css?
can I use just these parts of bootstrap 4 ?
can I sell my theme with this CSS file?
its ok to copy and change some part of this files?
which license I need to use in my theme?
my question is more about licenses...
https://v4-alpha.getbootstrap.com/about/license/
Read the first couple Lines. Bootstrap has an MIT open source license. you can find more on that here. https://en.wikipedia.org/wiki/MIT_License
You can copy and paste the code that you want however you must keep the Copyright title intact for the pieces that you use from bootstrap.
You could just override bootstrap my adding your own class on top of bootstrap's class
.row.shaheparsRow {
padding: 0
}
This question already has answers here:
Using mixins in bootstrap 3 to avoid unsemantic markup for layout structure
(3 answers)
Closed 8 years ago.
If we use bootstrap without a preprocessor we add classes into our opening tags like this:
<div id="El" class="col-md-1"></div>
I'm used to using bourbon neat with sass, in which case I can import mixins within the rules for my elements in sass. In which case I can do things like this:
#myEl
#import span-column(6)
Looking at the less documentation for bootstrap here: http://bootstrapdocs.com/v3.1.1/docs/css/#less it appears that there are no mixins available for bootstraps grid system. They've got convenience mixins for vendor prefixes, transitions, gradients and other things, but nothing for their own grid system.
So I've got a couple of questions:
How do I use less to define my grid using bootstrap?
And, if I want to do actually do this, am I working against the tool itself? I'm thinking that if using the less version of bootstrap this way isn't documented, then maybe there's good reason for it. Perhaps the less version of bootstrap just isn't supposed to be used this way and I should be using another set of tools instead?
You could do this, but you have to write just less. A good introduction to less is at their website: www.lesscss.org.
In your case you need:
#import 'bootstrap/bootstrap.less';
#import 'bootstrap/theme.less';
#El {
.col-md-1;
}
Then you compile this file with lessc. After that, your #El-element will behave like a .col-md-1.
Intentionally, Bootstrap is meant to use with their css class and using their less-files is not the first way of bootstrap. But if you know bootstrap and less well, you shouldn't have problems. If you start fresh with bootstrap, I recommend that you use just their css.
This question already has answers here:
Twitter Bootstrap Customization Best Practices [closed]
(7 answers)
Closed 8 years ago.
I have downloaded Twitter Bootstrap from http://getbootstrap.com/customize/
and now I would change some proprieties such as #body-bg or #navbar-default-bg.
Before Bootstrap, I used Zurb Foundation and I changed "foundation_and_override.sass" file. Is there something similar for Bootstrap?
My project is on Ruby on Rails
Check out this similar question. It shouldn't matter which exact file you put it in.. all the css will get compiled in your assets directory in rails.
Twitter Bootstrap Customization Best Practices
You can use this bootstrap gem in Rails, it's well maintained and up to date. The variables are defined here, so you know which value to set before your #import 'twitter/bootstrap' statement as shown in the Readme.
I'm using this exact same approach and am quite happy with it.
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
Tool to identify unused css definitions
I have quite big CSS file, that already contains style definition for classes/elements that are not used by markup any more.
It is possible to find those quick?
You can use the Firefox extension Dust-Me at http://www.sitepoint.com/dustmeselectors/.
you can get the Dust-Me Selectors plug in for Firefox to test pages individually or spider a whole site.
This question already has answers here:
Closed 12 years ago.
Possible Duplicate:
GWT theme style overrides my css style
What should I do to prevent GWT from using its theme and totally use the CSS that I specify?
Well, you can be radical and just remove the CSS files that are in the com.google.gwt,user.theme.chrome/dark/standard packages (don't forget to remove then from the gwt.xml file). Then specify your own CSS....disadvantage is that you have to style absolutely everything yourself. Hope this helps.