В прошлом уроке мы убедились, что браузеры читают стили CSS сверху вниз. Это означает, что в случае конфликта браузер будет использовать ту декларацию CSS, что прописана в последнюю очередь. Но мы еще не закончили. Существуют и другие способы переопределения CSS. Вы помните атрибуты id? Давайте переопределим ваши классы с pink-text и blue-text и сделаем ваш элемент h1 оранжевым, указав элементу h1 идентификатор, а затем прописав стиль для этого идентификатора.

Дайте элементу h1 атрибут id=orange-text . Пример:

<h1 id="orange-text">...</h1>

#brown-text {
  color: brown;
}  

CSS расшифровывается как Cascading Style Sheets, то есть Каскадные таблицы стилей.

В CSS есть сотни свойств, которые вы можете использовать, чтобы изменить стили отображения элементов на вашей странице. Когда вы указали

<h2 style="color: red;">CatPhotoApp</h2>

 <style> 
 </style> 

<style>
  h2 {
    color: red;
  }
</style> 

Удалите атрибут стиля элемента h2 и вместо этого создайте блок style CSS. Добавьте необходимые правила CSS, чтобы все элементы h2 стали синими (blue).

Теперь давайте изменим цвет некоторых наших текстов. Мы можем сделать это, изменив style вашего элемента h2 . Свойство, отвечающее за цвет текста элемента, является свойством стиля color . Вот как вы можете задать цвет текста вашего элемента h2 синим:

<h2 style="color: blue;">CatPhotoApp</h2>

Измените стиль элемента h2 так, чтобы его цвет текста был красным.

В прошлом уроке мы убедились, что браузеры читают стили CSS сверху вниз. Это означает, что в случае конфликта браузер будет использовать ту декларацию CSS, что прописана в последнюю очередь. Но мы еще не закончили. Существуют и другие способы переопределения CSS. Вы помните атрибуты id? Давайте переопределим ваши классы с pink-text и blue-text и сделаем ваш элемент h1 оранжевым, указав элементу h1 идентификатор, а затем прописав стиль для этого идентификатора.

Дайте элементу h1 атрибут id=orange-text . Пример:

<h1 id="orange-text">...</h1>

#brown-text {
  color: brown;
}