Получить консультацию

Кратко о видео

В уроке разобраны все ключевые единицы измерения: пиксели (px) — когда уместны и когда нет, проценты (%) — для ширины блоков, viewport-единицы (vw, vh) — для полноэкранных секций и fluid-вёрстки. Показаны реальные примеры и типичные ошибки с каждой единицей. Самая частая ошибка — ширина блоков в пикселях. Пиксель абсолютен: блок в 1200px на экране 320px вылезет за границу. Процент — это доля от родителя, поэтому блок в 100% всегда вмещается. VW — это процент от ширины экрана, независимо от вложенности. Урок для всех, кто начинает верстать в Taptop и путается в единицах измерения. После просмотра у тебя будет чёткое правило: ширина — проценты, шрифты и отступы — пиксели или em, полноэкранные высоты — vh.

Единицы измерения в Taptop: px, %, vw, vh и как их комбинировать

Верстаешь блоки — и непонятно, что писать: пиксели, проценты или vw? На десктопе выглядит хорошо, на планшете — уже не то. Когда и какую единицу использовать?

Ошибка большинства — ширина блоков в пикселях. Правило: ширину ставим в процентах или vw, ограничиваем через max-width в px. Проценты — относительно родителя, vw — относительно экрана. Комбинируем с примерами. Для новичков, которые путаются в единицах измерения. После просмотра задаёшь размеры правильно и адаптив работает без правок.

Тайминги видео

00:00 — Что такое отзывчивая вёрстка и зачем нужны разные единицы 01:30 — Пиксели (px): шрифты, отступы, иконки — когда px уместен 03:30 — Проценты (%): ширина блоков, адаптивность дочерних элементов 06:00 — Auto: как родитель обнимает контент, как дочерний растягивается 08:30 — Viewport (vw/vh): полноэкранные секции и адаптивный текст 10:30 — Min/max ширина и высота: ограничение элементов на больших экранах 12:30 — Связки: 100% + max-width, vw + max-width, практические кейсы