Frontend Разработка | JavaScript & Верстка сайтов. HTML, CSS и React. Уроки для Фронтенд Developer. JS, Vue и Web технологии. IT Карьера, Курсы и Coding.
Наука · 19 июля 2026 г.
🔥 Трюк с :has() в CSS: "Родительская магия" — 19 июля 2026 г. в 06:59:04.622
🔥 Трюк с :has() в CSS: "Родительская магия" Селектор :has() наконец стабильно работает во всех современных браузерах. Это открывает мощные возможности — реакция родителя на состояние потомка без JS! Пример: подсветить div, если внутри есть заполненный input: div:has(input:valid) { border: 2px solid green; } Или показать ошибку, если инпут невалиден: form:has(input:invalid) .error-message { display: block; } 📌 Зачем это нужно: - 💡 Упрощает логику UI без JS - 🚫 Убирает необходимость в лишних классах и хендлерах - 💪 Делает компоненты декларативнее и чище Проверить поддержку: https://caniuse.com/css-has 👉 @frontend_1