ZorNet.Ru — сайт для вебмастера » HTML и CSS » Сделать вид материалов в несколько колонок

Сделать вид материалов в несколько колонок

Сделать вид материалов в несколько колонок
Теперь появилась возможность изменить свой вид материала, который можно разбить на несколько колонок и тем самым сделать его оригинальным. Если вы решили сделать на своем сайте вид материала в несколько колонок, это две, три или в четыре, что все можно создать самому. Для этого нужно найти сам вид материала с которого и будем строить. Здесь нужно подчеркнуть, чтоб он был в дизайн без ссылок, а это вся стилистика шла на CSS, это для того, чтоб его легче было адаптировать.

Здесь модуль может быть любой, что как пример можно взять исходящий, что шел по умолчанию в 2 колонку. И вот из него на тестовом сайте сделай в 2 и немного изменил на этом вид структуру.

Создаем в 2 колонки.

Нам поможет этот код, что после как все сделаете, только останется в стилях редактировать и выставить как вам нужно.

Код
<div style="width:50%; float:left;">  
код шаблона вида материалов.  
</div>

Это уже на три колонки:

Код
<div style="width:33%; float:left;">  
Здесь ставим полный код вид материала.  
</div>

И крайний момент идет на четыре колонки:

Код
<div style="width:25%; float:left;">  
код шаблона вида материалов  
</div>

Для того чтоб понять как визуально все будет выглядеть, то заходим по этой ссылке, где изначально идет под одну колонку. А вот этот же код и стили на материал, что уже выставлено на 2 колонки и также изменил цветовую гамму.

Не забываем обращать внимание на стили, что по умолчанию идет.

Источник: forum.ucoz.ru
24 Сентября 2017 Просмотров: 1220 Комментариев: (2)

Поделиться в социальных сетях

Материал разместил

Оставь свой отзыв

Комментарии: 2
workman
workman 24 Сентября 2017 16:361
0
Лучше всего указывать корень класса стилей и устанавливать в таблицу стилей. Особенно для тех кто адаптирует дизайн под просмотр с мобильного
Kosten
Kosten 24 Сентября 2017 16:512
0
Согласен, что его все равно нужно будет адаптировать, здесь просто показано, как раскидать можно.
avatar