Знакомство с CSS / Каскадность [9/15]
×

Каскадность [9/15]

Напомним, что CSS расшифровывается как «каскадные таблицы стилей». Почему именно каскадные?

Всё дело в том, что стили для элемента могут быть определены в нескольких местах: внутри одного файла стилей и в разных файлах стилей.

Браузер находит все CSS-правила, затрагивающие данный элемент, а затем комбинирует их и получает итоговый список свойств для этого элемента. Комбинирование свойств производится по чётким правилам, которые опираются на приоритетность и специфичность.

Название «каскадные» появилось из-за описанного механизма комбинирования стилей из разных CSS-правил.

В этом задании мы скомбинируем стили для одного из абзацев.

Хотите писать JavaScript, используя современный синтаксис (ES2015, ES2016, ES2017)? Уметь тестировать свои программы? Записывайтесь на продвинутый интенсив по JavaScript.

Выполнить задание
HTML
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Каскадность</title> </head> <body> <h1>Каскадность и просветление</h1> <p>Каскадность — это очень мощный механизм.</p> <p>Веб-разработчик, постигший тайны каскадности, достигает просветления в вёрстке и становится гуру.</p> <p>Веб-разработчик, не стремящийся постигнуть каскадность, так и останется подмастерьем.</p> </body> </html>
CSS
p { outline: 2px solid rgba(0, 0, 0, 0.1); } .truth { }
HTML Academy
  1. Добавьте в CSS-правило для тега p свойство padding: 10px;.
  2. В CSS-правило для класса truth свойство background-color: #dff0d8;.
  3. В HTML-редакторе добавьте класс truth второму абзацу.
Теория Проверить Следующее задание
Идёт запись на курс JavaScript, уровень 2 #5, который стартует 28 мая.

Обсуждение и комментарии

Если у вас возникли сложности при прохождении задания, то вы можете обратиться за помощью на наш форум. Мы отслеживаем сообщения и постараемся ответить максимально быстро.

Пожалуйста, не пишите решение задач. Такие сообщения будут удаляться.

Перейти на форум или открыть комментарии.