Bootstrap Colors

by Online Tutorials Library July 14, 2022

Colors

By using utility classes you can change the color of the text. It can also be used to links and will darken on hover just like our default link styles.

Syntax:

Muted Class:

  <p class=”text-muted”>Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.</p>   

Primary Class:

  <p class=”text-primary”>Nullam id dolor id nibh ultricies vehicula ut id elit.</p>   

Success:

  <p class=”text-success”>Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>  

Info:

  <p class=”text-info”>Maecenas sed diam eget risus varius blandit sit amet non magna.</p>  

Warning:

Danger:

  <p class=”text-danger”>Donec ullamcorper nulla non metus auctor fringilla.</p>  

White:

Contextual text classes can also be used with anchors tags with the provided hover and focus states.

Note: The .text-white class has no link styling.

Example:

   <a href=”#” class=”text-muted”>Muted link</a>  <a href=”#” class=”text-primary”>Primary link</a>  <a href=”#” class=”text-success”>Success link</a>  <a href=”#” class=”text-info”>Info link</a>  <a href=”#” class=”text-warning”>Warning link</a>  <a href=”#” class=”text-danger”>Danger link</a>  

Next TopicBootstrap Flexbox

Bootstrap Colors

Colors

Syntax:

Note: The .text-white class has no link styling.

Example:

AutoCAD 360

Basic Site creation in CodeIgniter

You may also like