Материалы

Системы контроля доступа

Заголовки

H1 Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

H2 Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

H3 Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

H4 Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

H5 Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

H6 Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.


Текстовые колонки

 

Вы можете располагать текст в несколько колонок, используя простой html-код.

Использование: <div class=”grid-layout”><div>Текст в колонке 1</div><div>Текст в колонке 2</div></div>

 

Текст, разделенный на 2 колонки

Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Текст, разделенный на 3 колонки

Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Заголовок

Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Текст, разделенный на 4 колонки

Заголовок

At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Заголовок

At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Заголовок

At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Заголовок

At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Цитата (Тэг <blockquote>)

 

You can us this style to quote somebody's speech, idea or a fragment from some book, articles, etc. Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

 

Использование: <blockquote>Ваша цитата</blockquote>

Подсвеченный текст

 

You can use this style to highlight important words and / or keyword expression in search result page. Lorem ipsum dolor sit amet consectetuer eleifend elit vel tellus laoreet. At ut pellentesque risus quis sem eros et consequat enim lorem. Aenean lorem consequat consequat eu.

Использование: <span class="text-highlight">Текст, который вы хотите подсветить</span>

 

Подсветка блока с текстом при наведении мыши

You can use this style to highlight important text block on mouse over. Just roll mouse over this text block to see how it's highlighted.

Использование: <div class="text-box-highlight">Текст, который будет подсвечен.</div>

You can use this style to highlight important text block on mouse over. Just roll mouse over this text block to see how it's highlighted.

Использование: <div class="text-box-highlight">Текст, который будет подсвечен.</div>


Кнопки


Использование: <a class="link-button button-xxx>Текст кнопки</a>

, где button-xxx - класс, который нужно присвоить ссылке и который будет зависеть от внешнего вида кнопки.

Кнопка

class="link-button button-light"


Кнопка

class="link-button button-dark"

Кнопка

class="link-button button-blue"


Кнопка

class="link-button button-green"

Кнопка

class="link-button button-pink"


Кнопка

class="link-button button-orange"

Специальные кнопки


Использование: <a class="button-box>Текст кнопки</a>


Кнопка


Кнопки(флаг)


Использование: <a class="link-button button-xxx button-flag>Текст кнопки</a>

, где button-xxx - класс, который нужно присвоить ссылке и который будет зависеть от внешнего вида кнопки.

Кнопка

class="link-button button-light button-flag"


Кнопка

class="link-button button-dark button-flag"

Кнопка

class="link-button button-blue button-flag"


Кнопка

class="link-button button-green button-flag"

Кнопка

class="link-button button-pink button-flag"


Кнопка

class="link-button button-orange button-flag"

Table Styles

Plain Rows table style

Table headerColumn header 1Column header 2Column header 3
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Table footer Footer data

Color Stripes table style

Table headerColumn header 1Column header 2Column header 3
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Table footer Footer data

Grey Stripes table style

Table headerColumn header 1Column header 2Column header 3
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Row header 1 Lorem ipsum Dolor sit amet Lorem ipsum
Table footer Footer data

List styles

Standard list styles

Unordered list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Ordered list
  1. Lorem ipsum dolor sit amet
  2. Consetetur sadipscing elitr
  3. Sed diam voluptua

Arrow list styles

Red arrow
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Blue arrow
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Green arrow
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua

Icon list styles

Article icon list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Folder icon list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Image icon list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Online icon list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Star icon list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
User icon list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua

You can assign any of predefined 20 icons to list items. 6 icons shown above are just samples.

Number list styles

Blue Bullet number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Green Bullet number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Violet Bullet number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Orange Bullet number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Red Bullet number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Grey Bullet number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Blue Digit number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Green Digit number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Violet Digit number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Orange Digit number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Red Digit number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Grey Digit number list
  • Lorem ipsum dolor sit amet
  • Consetetur sadipscing elitr
  • Sed diam voluptua
Вверх