查看“BootStrap Colour Classes”的源代码

      <p>Each BootStrapSkin stylesheet has 23 colours to choose from, 4 Bootstrap and 14 custom colours, and a further 5 shades of the stylesheet being used.</p>
        <p>The examples below use the bootstrap-blue.css stylesheet, but you can also choose from 10 other colour styles.</p>
<p>'''Shaded colour classes''';</p>
<div class="btn btn-default" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> default</div> <div class="btn btn-light" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> light</div> <div class="btn btn-lighter" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> lighter</div> <div class="btn btn-dark" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> dark</div> <div class="btn btn-darker" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> darker</div>
<p>'''BootStrap colour classes''';</p>
<div class="btn btn-info" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> info</div> <div class="btn btn-success" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> success</div> <div class="btn btn-warning" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> warning</div> <div class="btn btn-danger" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> danger</div>
<p>'''Custom colour classes''';</p>
<div class="btn btn-neutral" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> neutral</div> <div class="btn btn-neutral-light" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> neutral-light</div> <div class="btn btn-primary" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> primary</div> <div class="btn btn-cyanide" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> cyanide</div> <div class="btn btn-meadow" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> meadow</div> <div class="btn btn-cocktail" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> cocktail</div> <div class="btn btn-mango" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> mango</div> <div class="btn btn-berry" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> berry</div> <div class="btn btn-hearts" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> hearts</div> <div class="btn btn-party" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> party</div> <p></p><div class="btn btn-midnight" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> midnight</div> <div class="btn btn-cello" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> cello</div> <div class="btn btn-hollow" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> hollow</div> <div class="btn btn-concrete" style="margin:3px;"><i class="fa fa-exclamation-triangle"></i> concrete</div>
<h4 class="subtitle-black">Using Colors</h4>
<p>Add any of the colors listed above, the buttons are used as a guide, but can be added to any of the Bootstrap styles e.g. panels, buttons, alerts etc.</p>
<pre>
<div class="btn btn-concrete"><i class="fa fa-exclamation-triangle"></i> concrete</div>
</pre>
<p>In the example above we're using the concrete color class with a button, to change the color replace concrete to any of the names shown on the example buttons.</p>