HTML classes cheatsheet

While our themes do not require any knowledge of coding, it sometimes helpful to apply a certain style by adding a html class to a row, cell a widget or custom HTML.
This is a list of reusable HTML classes which might be useful for styling purposes:

Text colors:

text-light
text-dark
primary-color
secondary-color
tertiary-color

background colors:

black-color-bg
primary-color-bg
secondary-color-bg
tertiary-color-bg

Text sizes:

h1 (heading 1 font size)
h2 (heading 2 font size)
h3 (heading 3 font size)
h4 (heading 4 font size)
h5 (heading 5 font size)
h6 (heading 6 font size)
lead
small

Font families:

font-2 (heading font)
font-3 (button and navigation font)

Alignments:

text-left
text-right
text-center

Shadows:

  • shadow-1
  • shadow-2
  • shadow-3

hiding on different devices

  • hidden-xs
  • hidden-sm
  • hidden-md
  • hidden-lg

* For more detailed description please check Bootstrap docs


overlay-dark
overlay-light
overlay-c1
overlay-c2
overlay-c3
overlay-c2-c1
overlay-c1-c2
overlay-c1-t
overlay-c2-t
overlay-c3-t
Was this article useful? 2

Orion

Living the WordPress Magic.