установить класс на определенный размер экрана (начальная загрузка)

Question

Я работаю с начальной загрузкой.

И хотел бы загрузить несколько классов в зависимости от размера экрана, например sm-col, xs.col.

Пример: получил текстовый идентификатор

<div id="text" class="xs-format lg-format ..."></div>

style = 
.sm-format{
 column-count: 3;
}

.xs-format{
 column-count: 1;
}

.lg-format{
 column-count: 5;
}

Он должен загружать текст в 1 столбец, если загружается экран xs, 3 столбца на экранах sm и 5 на экранах lg.

Любой намек?

С уважением n00n

Answer 1

Вы можете просмотреть столбцы карт Bootstrap , но вам придется редактировать медиазапросы, если вы хотите более 3 столбцов на экранах большего размера.