Измените цвет текста в заголовке второго уровня Калуша с Калушатами на синий (blue). При этом все остальные заголовки должны остаться без изменений.
Чтобы указать на заголовок второго уровня, потребуется селектор h2. Но есть сложность, на странице два заголовка h2, а изменить нужно только один из них. Следовательно, для того, чтобы указать только на тот заголовок h2, который расположен внутри тега div и явяется его непосредственным ребёнком, потребуется дочерний селектор. Это позволит не затронуть при перекрашивании другой заголовок второго уровня — Разметка к задачам.
Наконец, чтобы перекрасить заголовок в синий цвет, потребуется свойство color, определяющее цвет текста элемента, и его значение blue.
div > h2 {
color: blue;
}
Напишите правило, которое изменит цвет текста для всех выделенных тегом strong упоминаний Калушат на коричневый (brown) цвет.
Тег strong это такой же тег, как и любой другой, например p или h1, а значит, к нему можно обратиться просто по названию. Снова воспользуемся свойством color:
strong {
color: brown;
}
Напишите правило для всех выделенных тегом span упоминаний Бутявки, находящихся внутри цитат (blockquote), измените цвет текста на желтый (yellow) и задайте полужирное начертание.
Составляем селектор потомков — комбинацию селекторов span и blockquote, позволяющий выбрать абсолютно все теги span, расположенные внутри цитат blockquote, включая также те теги span, которые находятся внутри вложенных в цитаты абзацев и списков.
Для того чтобы задать полужирное начертание воспользуемся свойством font-weight и его значением bold:
blockquote span {
color: yellow;
font-weight: bold;
}
Напишите правило, согласно которому все выделенные тегом strong упоминания Калушат внутри списка ol имели бы наклонное начертание.
Для решения данного задания снова потребуется селектор потомков — ol strong. Дочерний селектор ol > strong мы не можем использовать по той причине, что в тег ol всегда должен быть вложен тег элемента списка li, следовательно strong никогда не окажется непосредственным ребёнком ol, он может быть только внуком.
Для того чтобы задать наклонное начертание используем свойство font-style и значение italic:
ol strong {
font-style: italic;
}
Вы можете посмотреть, как выглядят выполненные задания на Codepen.