FRONTEND_1 Telegram 4042
Мини-хак: :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
👍3



tgoop.com/frontend_1/4042
Create:
Last Update:

Мини-хак: :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

BY Frontend разработчик




Share with your friend now:
tgoop.com/frontend_1/4042

View MORE
Open in Telegram


Telegram News

Date: |

Image: Telegram. Done! Now you’re the proud owner of a Telegram channel. The next step is to set up and customize your channel. So far, more than a dozen different members have contributed to the group, posting voice notes of themselves screaming, yelling, groaning, and wailing in various pitches and rhythms. Among the requests, the Brazilian electoral Court wanted to know if they could obtain data on the origins of malicious content posted on the platform. According to the TSE, this would enable the authorities to track false content and identify the user responsible for publishing it in the first place. Ng Man-ho, a 27-year-old computer technician, was convicted last month of seven counts of incitement charges after he made use of the 100,000-member Chinese-language channel that he runs and manages to post "seditious messages," which had been shut down since August 2020.
from us


Telegram Frontend разработчик
FROM American