HTML Templates Documentation

Buttons

In HTML Website Template, the buttons are defined with the help of 3 classes:

• .btn

  the basic button class;

• .btn-xs, .btn-sm, .btn-md, .btn-lg, .btn-xl

  button layout classes, responsible for its size;

• .btn-default, .btn-primary, .btn-secondary-*

  button styling classes, responsible for its color and background.

Here is an example:

        <a href="#" class="btn btn-lg btn-primary">Read More</a>
    

In this example, one creates a large button with primary template color styling.

Icons

HTML Website Template contains more than 2500 ready-made icons. A list of all icons can be found on the Components > Toolkit Components > Icons page. To add an icon to the target page, use the following marking:

    <span class="your-icon-class"></span>
  

A list of classes for adding target icons is also available on the Components > Toolkit Components > Icons page.

In HTML Website Template, icon styling is defined as button styling:

• .icon

  the basic icon class;

• .icon-xs, .icon-sm, .icon-md, .icon-lg, .icon-xl

  icon layout classes, responsible for its size;

• .icon-default, .icon-primary, ...

  icon styling classes, responsible for its color and background.

• fa-*, glyph-*, mdi-* ...

  classes, responsible for icon code (symbol) insert.

Here is an example:

    <span href="#" class="icon icon-md icon-default"></span>
  

In this example, one creates a middle-sized icon with primary template color styling.