Frontend Разработка | JavaScript & Верстка сайтов. HTML, CSS и React. Уроки для Фронтенд Developer. JS, Vue и Web технологии. IT Карьера, Курсы и Coding.
Наука · 9 октября 2026 г.
Мини-хак: :has() в CSS — меньше JS для интерактивности 🎯
Мини-хак: :has() в CSS — меньше JS для интерактивности 🎯 Современные браузеры уже поддерживают :has() — “родительский селектор”, который раньше приходилось эмулировать на JS. Пример: показать рамку у карточки, если внутри есть картинка: .card:has(img) { border: 2px solid #4ade80; } Ещё круче: стилизовать соседний элемент, если внутри инпута что-то введено: .input-wrapper:has(input:focus) label { color: #3b82f6; } Зачем это нужно? — Меньше JS → проще поддержка — Новый уровень гибкости для UI Документация: MDN про :has() Пробуйте! Это реально меняет подход к верстке. 👉 @frontend_1