вёрстка

Вёрстка

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

Как верстать на HTML5 и CSS3

Это книга о создании сайтов на HTML5 и CSS для самых новичков. Цель этой книги — рассказать об искусстве создания сайтов простым языком, полным практических аналогий. После прочтения свыше 100 печатных страниц вы освоите основные понятия и методы веб-разработки и будете в состоянии сделать свой первый сайт!

Многоколоночный макет

Пока нам удалось задать вид статьи, создать меню и форму комментариев. Давайте поместим всё это вместе в трёхколоночный макет, где меню слева, статья и форма комментариев по середине, а список материалов, связанных со статьёй, находится справа. Предположим, что вся страница занимает ширину 960 пикселей и расположена по центру.

Модульные сетки

Bootstrap характерен своей продуманной и гибкой системой модульных сеток, в основе которой лежит 12-колоночный макет.

Упражнение: верстаем пост блога

Настало время для другого упражнения, которое покажет вам философию вёрстки более сложных сайтов на HTML5. Мы постараемся представить следующий пример в виде статьи блога.