Skip to main content Skip to docs navigation

Bootstrap Typography

Headings

h1 heading

h2 heading

h3 heading

h4 heading

h5 heading
h6 heading
scala
h1.apply("h1 heading") ++
  h2.apply("h2 heading") ++
  h3.apply("h3 heading") ++
  h4.apply("h4 heading") ++
  h5.apply("h5 heading") ++
  h6.apply("h6 heading")

Display headings

Display 1
Display 2
Display 3
Display 4
Display 5
Display 6
scala
display_1.apply("Display 1") ++
  display_2.apply("Display 2") ++
  display_3.apply("Display 3") ++
  display_4.apply("Display 4") ++
  display_5.apply("Display 5") ++
  display_6.apply("Display 6")

Lead

Lead paragraph example
scala
lead.apply("Lead paragraph example")

Inline text elements

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus magna at lorem faucibus, vel condimentum lacus imperdiet.

del tag example

s tag example

ins tag example

u tag example

small tag example

strong tag example

em tag example

scala
<p>{mark.apply("Lorem ipsum")} dolor sit amet, consectetur adipiscing elit. Nulla luctus magna at lorem faucibus, vel condimentum lacus imperdiet.</p> ++
  p.apply(del.apply("del tag example")) ++
  p.apply(s.apply("s tag example")) ++
  p.apply(ins.apply("ins tag example")) ++
  p.apply(u.apply("u tag example")) ++
  p.apply(small.apply("small tag example")) ++
  p.apply(strong.apply("strong tag example")) ++
  p.apply(em.apply("em tag example"))

Abbreviations

WWW

scala
p.apply(abbr.apply("WWW").withTitle("World Wide Web"))

Blockquotes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a porttitor elit, eu viverra nibh.

Centered blockquote

Aligned to the right blockquote

scala
blockquote.apply(p.apply("Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a porttitor elit, eu viverra nibh.")) ++
  blockquote.apply(p.apply("Centered blockquote")).text_center ++
  blockquote.apply(p.apply("Aligned to the right blockquote")).text_end

Blockquotes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a porttitor elit, eu viverra nibh.

Centered blockquote

Aligned to the right blockquote

scala
blockquote.apply(p.apply("Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a porttitor elit, eu viverra nibh.")) ++
  blockquote.apply(p.apply("Centered blockquote")).text_center ++
  blockquote.apply(p.apply("Aligned to the right blockquote")).text_end

Lists

  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
  • Nested list:

    • Item 1
    • Item 2
    • Item 3
    • Item 4
    • Item 5
scala
ul.list_unstyled.apply {
  li.apply("Item 1") ++
    li.apply("Item 2") ++
    li.apply("Item 3") ++
    li.apply("Item 4") ++
    li.apply("Item 5") ++
    li.apply(p.apply("Nested list:") ++
      ul.apply {
        li.apply("Item 1") ++
          li.apply("Item 2") ++
          li.apply("Item 3") ++
          li.apply("Item 4") ++
          li.apply("Item 5")
      }
    )
}