Фронтенд-новости #21
- 29 августа 2022
- 548
Дайджест новостей и полезных статей из мира фронтенд-разработки за неделю 22–28 августа.
🔥 Три главные статьи
- Выражения от контейнера изменили синтаксис.
- Знакомимся с top layer. Не забывайте свои корни, есть вещи на порядок выше
z-index: 10000
. - Выражение от стилей — тоже выражение от контейнера, только чуть по-другому.
🖌 CSS
📔 Будьте бдительнее: выражения от контейнера изменили синтаксис, но в последний раз. Самое крупное изменение: теперь в свойстве container
имя перед косой чертой должно идти первым container: page-layout / inline-size;
📔 Большое количество примеров использования:has()
, начиная с основ, применения в гридах, использования с дочерним и родственными селекторами и заканчивая использования формы без JavaScript.
📔 2 часть использования гридов и кастомных фигур.
📔 Понятно о выражениях от стилей контейнера. Все мы привыкли, что есть выражения от контейнера и думаем, что выражения работают только от размеров (width
, height
). Но выражения также будут работать с опорой на стили. Спецификация.
📔 Современные CSS-селекторыis()
, :where()
, :has()
. Обзор и разбор.
📔 Познакомимся с top layer и попрощаемся с z-index: 10000
.
📔 Как вы используете CSS Columns? Для двухколоночного текста? Попробуйте что-то новое.
🎻 Инструменты
📔 check-html-links — проверяет работоспособность ссылок.
🕸 Браузеры
📔 Могут ли браузеры оптимизировать загрузку сторонних ресурсов. Сложный вопрос и понятный ответ в блоге Chrome.
🎓 Общее
📔 Как сделать отличную кнопку-переключатель? Исследование Эдварда Курича.

Как читать статьи на английском языке
В дайджесте много статей и видео на английском языке, чтобы это не стало препятствием: в Google Chrome есть функция перевода страницы с любого популярного языка, а видео можно перевести в Яндекс Браузере.