Web Style Guide
Typography
Headings
All heading styles from h1 through h4.
h1 Heading Level 1
h2 Heading Level 2
h3 Heading Level 3
h4 Heading Level 4
p = Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
a - This is a linkStandard Copy
All standard paragraphy info and styling including strong, bold, italic and emphasis.
A paragraph (from the Greek paragraphos, "to write beside" or "written beside") is a self-contained unit of a discourse in writing dealing with a particular point or idea. A paragraph consists of one or more sentences. Though not required by the syntax of any language, paragraphs are usually an expected part of formal writing, used to organize longer prose.
A paragraph (from the Greek paragraphos, "to write beside" or "written beside") is a self-contained unit of a discourse in writing dealing with a particular point or idea. A paragraph consists of one or more sentences. Though not required by the syntax of any language, paragraphs are usually an expected part of formal writing, used to organize longer prose.
A paragraph (from the Greek paragraphos, "to write beside" or "written beside") is a self-contained unit of a discourse in writing dealing with a particular point or idea. A paragraph consists of one or more sentences. Though not required by the syntax of any language, paragraphs are usually an expected part of formal writing, used to organize longer prose.
Forms
Basic Example
Individual form controls automatically receive some global
styling. All text based input, textarea, and select elements are
set to width: 100%; by default. Labels and Placeholders are
visible by default. Add the .sr-only
helper class
to labels that you don't want to display.
Disabled States
Adding the disabled
attribute will prevent users
from interacting with the input. By default disabled inputs are
lighter.
Styled Checkboxes & Radio Buttons
Pagination
Basic Example
Simple paginate.
Tabs
Product Info Tabs
Aliquam cursus magna eleifend odio blandit, id pretium felis tincidunt. Aliquam nec luctus eros. Aliquam nisi purus, cursus eu est fringilla, rhoncus ultricies enim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer dictum ex ut diam luctus ornare. Duis sed lacus sit amet mauris vestibulum blandit vel quis tortor. Phasellus gravida iaculis ex vel pharetra. Quisque sagittis eros massa, eget dignissim massa suscipit scelerisque. Quisque pretium augue id turpis varius, viverra hendrerit turpis dapibus. Donec pulvinar, ante a commodo vehicula, ligula augue condimentum odio, luctus blandit ante ex ut elit. Vestibulum finibus ligula quis ex varius suscipit. Nunc urna eros, maximus vitae pharetra non, blandit eu tortor.