Задачи по JS/CSS/HML

Вопрос на CSS собеседовании. Представьте, что есть таблица с данными. Назовите способ добавления свойства opacity для всех строк, кроме той, на которую навел пользователь. Ответ: Нам требуется использовать сложный селектор, в котором установим свойство opacity для всех строк, используя tbody:hover, а через :not(:hover) отменим свойство opacity для наведенной строки.

tbody:hover tr:not(:hover) { opacity: 0.24; }

#css #собеседование

Вопрос на CSS собеседовании. Как я могу задать CSS для элемента, в котором есть элемент, находящийся в фокусе? Ответ: Через псевдокласс :focus-within.

<div class="some-parent"> <button type="button">Some button</button> </div>

.some-parent:focus-within { outline: 2px solid purple; outline-offset: 5px; }

#css #собеседование

Вопрос на CSS собеседовании. Как работает псевдокласс :placeholder-shown? Ответ: Псевдокласс :placeholder-shown срабатывает, когда у элементов input или textarea отображается placeholder. Если пользователь начинает ввод текста, то placeholder скрывается, и поэтому псевдокласс :placeholder-shown не применяется.

input:placeholder-shown { background-color: lightgray; }

#css #собеседование

Вопрос на CSS собеседовании. Как можно установить свойство opacity для элемента input, у которого установлен атрибут type со значением "radio"? Ответ: Чтобы отобрать элемент с type="radio" требуется использовать селекторы атрибутов.

input[type="radio"] { opacity: 0.24; }

#css #собеседование

Создал чат для обсуждения - пишите свои вопросы и предложения по контенту: https://t.me/+YShywCEkhylkMDVi

Вопрос на CSS собеседовании. Каким способом я могу установить свойство opacity для элемента button, у которого есть атрибут disabled? Ответ: Через псевдо-класс :disabled.

button:disabled { opacity: 0.24; }

#собеседование