Добро пожаловать на портал вебмастеров WebmastersBY

Верстка сайта

Верстка сайта во всех ее аспектах: наши публикации на тему мобильной и адаптивной HTML-верстки с примерами и готовыми шаблонами. Статьи для веб-верстальщиков разного уровня – от начинающих до экспертов с примерами и макетами.

Адаптивные изображения: атрибуты srcset и sizes
Верстка сайта Адаптивные изображения: атрибуты srcset и sizes

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

Bootstrap 4: обычная сетка vs flexbox-сетка
Верстка сайта Bootstrap 4: обычная сетка vs flexbox-сетка

Bootstrap 4 готовит для нас изменения в системе сеток, с которыми мы все хорошо знакомы по 3-й версии. Теперь она включает в себя новый уровень XL, также изменились некоторые классы модификаторов, и была добавлена совершенно новая сетка на основе flexbox.

Подробно о свойстве CSS Background
Верстка сайта Подробно о свойстве CSS Background

Каждый элемент в DOM-дереве напоминает прямоугольник, который имеет фоновый слой, он может быть либо полностью прозрачным, либо цветным, либо содержать изображение. Этот фоновый слой находится под контролем 8 свойств CSS (плюс 1-го сокращённого свойства).

Трюки с псевдоклассом :target
Верстка сайта Трюки с псевдоклассом :target

Псевдокласс :target используется для подсветки секции страницы с привязкой из оглавления. Он стилизует целевой элемент внешней ссылки в документе, определяемый атрибутом ID.

Flexbox: подробное руководство по CSS свойству третьей редакции
Верстка сайта Flexbox: подробное руководство по CSS свойству третьей редакции

Flexbox Layout официально называется CSS Flexible Box Layout Module. Это новая модель CSS3, направленная на улучшение работы с элементами, выравнивание, изменение направление и порядка их в контейнере, даже когда они динамические или неизвестного размера.