[Перевод] CSS :has() селектор


Вы когда-нибудь задумывались о селекторе CSS, где вы проверяете, существует ли конкретный элемент внутри родителя? Например, если у компонента карты есть миниатюра, нам нужно добавить к нему display: flex. Это было невозможно в CSS, но теперь у нас будет новый селектор CSS :has, который поможет нам выбрать родителя определенного элемента и многое другое.

В этой статье я объясню проблему, которую решает :has, как он работает, где и как мы можем его использовать с некоторыми вариантами использования и примерами, и, самое главное, как мы можем использовать его уже сегодня.

Читать далее


Уважаемые посетители,
Если Вы хотите оставить заказ на разработку сайта или получить предварительную консультацию воспользуйтесь формой по ссылке ниже.
Обратная связь
Наш специалист ответит вам в течении суток.



Похожие публикации

[Перевод] Свойства Min и Max width/height в CSS

Перевод «Min and Max Width/Height in CSS» Ахмада Шадида Порой у разработчиков возникает необходимость ограничить ширину элемента относительно родителя, и в то же время, оставить её динамичной. Задав... читать далее

[Перевод] Что происходит при создании контейнера Flexbox?

Это перевод статьи Rachel Andrew, являющейся одним из разработчиков спецификаций CSS. В короткой серии статей я собираюсь потратить некоторое время на детальную распаковку Flexbox — точно так же, как... читать далее

[Перевод] SVG фильтры 101

Это первая статья в серии об SVG фильтрах. Это руководство поможет понять, что это такое, и покажет, как использовать их для создания собственных визуальных эффектов. CSS в настоящее время... читать далее

[Перевод] Все, что вам нужно знать о выравнивании во Flexbox

Цикл публикаций по особенностям CSS-технологии Flexbox от Rachel Andrew. Что происходит при создании контейнера Flexbox. Резюме В этой статье мы рассмотрим свойства выравнивания во Flexbox, а также... читать далее

Полное руководство по CSS Flex + опыт использования

Как и CSS Grid, Flex Box довольно сложен, потому что состоит из двух составляющих: контейнера и элементов внутри него. Когда я начал изучать Flex, я хотел увидеть все, на что он способен. Но мне не... читать далее

[Перевод] Flexbox: насколько велика эта гибкая коробка?

Продолжаю публикацию переводов по особенностям CSS-технологии Flexbox. Из цикла опубликованы следующие статьи: Что происходит при создании контейнера Flexbox. Все, что вам нужно знать о выравнивании... читать далее

Прокомментировать


@

  • bowtiesmilelaughingblushsmileyrelaxedsmirk
    heart_eyeskissing_heartkissing_closed_eyesflushedrelievedsatisfiedgrin
    winkstuck_out_tongue_winking_eyestuck_out_tongue_closed_eyesgrinningkissingstuck_out_tonguesleeping
    worriedfrowninganguishedopen_mouthgrimacingconfusedhushed
    expressionlessunamusedsweat_smilesweatdisappointed_relievedwearypensive
    disappointedconfoundedfearfulcold_sweatperseverecrysob
    joyastonishedscreamtired_faceangryragetriumph
    sleepyyummasksunglassesdizzy_faceimpsmiling_imp
    neutral_faceno_mouthinnocent

Архив сайта

Реклама на сайте