Typography

Headings

h1 Heading 1

h2 Heading 2

h3 Heading 3

h4 Heading 4

h5 Heading 5
h6 Heading 6

Paragraphs

The global font-size, line-height and regular margins between elements are set through variables, which can be customized. Paragraphs and other block elements stick to these values.

Blockquotes

For quoting multiple lines of content from another source within your document, use the <blockquote> element.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Someone famous

Code blocks

For multiple lines of code, use the <pre> element which defines preformatted text. It creates a new text block that preserves spaces, tabs and line breaks. Nest a <code> element inside to define the code block.
IMPORTANT Be sure to escape any angle brackets in the code for proper rendering.

NOTE Optionally, you can add the .uk-scrollable-text class from the Utility component, which will set a max-height of 300px and provide a y-axis scrollbar.

Lists

Create an unordered list using the <ul> element and the <ol> element for ordered lists. The <li> element defines the list item.

  • Item 1
  • Item 2
    • Item 1
    • Item 2
      • Item 1
      • Item 2
  • Item 3
  • Item 4
  1. Item 1
  2. Item 2
    1. Item 1
    2. Item 2
      1. Item 1
      2. Item 2
  3. Item 3
  4. Item 4

Description lists

Create a description list using the <dl> element. Use <dt> to define the term and <dd> for the description.

Description lists
A description list defines terms and their corresponding descriptions.
This is a term
This is a description.
This is a term
This is a description.

Contact

Email us at info@independentsupportservice.org or use our contact form

T: 0161 872 6879                  Twitter: @IS_trafford            Facebook:  /independentsupporttrafford

Ground Floor East, Oakland House, Talbot Road, Old Trafford, Manchester, M16 0PQ

View on Google Maps

A project managed by Voluntary Community Action Trafford