Provide meaning to content.
<StyleSheet StyleSheet="Framework.bootstrap.bootstrap.css" /> <StyleSheet ShowModes="rdBrowser" StyleSheet="Framework.bootstrap.Overrides.css" /> <StyleSheet ShowModes="rdBrowser" StyleSheet="Fonts.combined.css" /> <StyleSheet ShowModes="rdBrowser" StyleSheet="Framework.css.Layout.css" /> <IncludeScriptFile ID="jquery" IncludedScriptFile="Framework.bootstrap.jquery.min.js" /> <IncludeScriptFile ID="bootstrap" IncludedScriptFile="Framework.bootstrap.bootstrap.js"> <Note Note="Includes Bootstrap.min.js, Popper.js or tether.js" /> </IncludeScriptFile>
.h1
.h2
.h3
.h4
.h5
.h6
Simply a shell of a h1 to assign the suitable amount of space. Click here to check out more page header and options.
h1
Make a paragraph stand out by adding .lead.
.lead
Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.
Convey meaning through color with a handful of emphasis utility classes. These may also be applied to links and will darken on hover just like our default link styles.
Use the.text-muted for disabled or unnecessary content.
.text-muted
Use the.text-primary for extra visual weight and identifies the primary content.
.text-primary
Use the.text-success to indicate successful or positive content.
.text-success
Use the.text-info for content related to information.
.text-info
Use the.text-warning to show caution should be taken with this action
.text-warning
Use the.text-danger to indicate a dangerous or harmful action.
.text-danger
Similar to the contextual text color classes, easily set the background of an element to any contextual class. Anchor components will darken on hover, just like the text classes.
Use the.bg-primary for extra visual weight and identifies the primary content.
.bg-primary
Use the.bg-success to indicate successful or positive.
.bg-success
Use the.bg-info for informational content.
.bg-info
Use the.bg-warning to show caution.
.bg-warning
Use the.bg-danger to indicate a dangerous or harmful action.
.bg-danger
<ins>
<u>
<abbr>
<del>
<s>
<small>
<strong>
.ThemeBold
<em>
<mark>
.text-justify
.text-nowrap
<kbd>
For longer content, you can add a .text-truncate class to truncate the text with an ellipsis. Requires display: inline-block or display: block. Requires display: inline-block or display: block.
.text-truncate
display: inline-block
display: block
Use .text-lowercase for lowercase text.
.text-lowercase
Use .text-uppercase for uppercase text.
.text-uppercase
use .text-capitalize to only changes the first letter of each word.
.text-capitalize
.text-left
.text-right
.text-center
.float-left
.float-right
Use .text-xs-left for left aligned text on viewports sized XL (extra-large) or wider.
.text-xs-left
Use .text-sm-right for right aligned text on viewports sized SM (small) or wider.
.text-sm-right
Use .text-md-center for center aligned text on viewports sized MD (medium) or wider.
.text-md-center
Use .text-lg-right for right aligned text on viewports sized LG (large) or wider.
.text-lg-right
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
A block of help text that breaks onto a new line and may extend beyond one line
This is an example of help text.