[Перевод] Именование в CSS Grid

Скрипты и советы | 5 декабря 2019 1 135

Уроки CSS на Хабрахабре, habrahabr.ru, Разработка веб-сайтов

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

На основе этой системы линий работают техники, делающие возможным именование линий и даже grid-областей. Использование этих техник позволяет размещать элементы по имени, а не по номеру. В этой статье я подробно рассмотрю различные способы именования линий и областей в CSS Grid разметке, а также несколько интересных возможностей, которые они создают.
Читать дальше →
[Перевод] Понимание CSS Grid (2 часть): Grid-линии

Перевод Understanding CSS Grid: Grid Lines» Rachel Andrew В первой статье из серии "Понимание CSS Grid" мы рассмотрели,...

Подробнее
[Перевод] Понимание CSS Grid (3 часть): Grid-области

Приветствую! Представляю вашему вниманию перевод статьи «Understanding CSS Grid: Grid Template Areas» автора Rachel...

Подробнее
CSS Grid понятно для всех

Что такое Grid? Grid представляет собой пересекающийся набор горизонтальных и вертикальных линий — один набор...

Подробнее
[Перевод] Гибкая разметка без медиа-запросов: функции min(), max(), clamp()

Перевод «Flexible layouts without media queries» Dannie Vinther С момента появления в браузерах в 2017 году, CSS Grid...

Подробнее
[Перевод] Понимание CSS Grid: Создание Grid-контейнера

Перевод «Understanding CSS Grid: Creating A Grid Container» Рейчел Эндрю Хотя технология CSS Grid стала поддерживаться...

Подробнее
[Перевод] CSS Grid — швейцарский армейский нож для макетов сайтов и приложений

В течение последних двух месяцев я углубился в изучение CSS Grid. В этой заметке я хочу поделиться своими основными...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями