Урок 2. Use CSS Selectors to Style Elements
С CSS има стотици CSS свойства, които можете да използвате, за да промените начина, по който изглежда елемент на страницата ви.
Когато въведохте <h2 style="color: red">CatPhotoApp</h2>, дадохте на h2 елемента индивидуален вграден стил/inline style.
Това е един от начините да добавите стил към даден елемент, но по-добрият начин е чрез използването на CSS, което означава "Cascading Style Sheets".
В горната част на кода си създайте стил като този: Въведете два тага за стил съответно на 2 ред: <style> и 3 ред: </style>
В този елемент на стил можете да създадете CSS selector за всички h2 елементи. Например, ако искате всички h2 елементи да бъдат червени, елементът style / стил ще изглежда така:
<style>
h2 {color: red;}
</style>
h2 {color: red;}
</style>
Обърнете внимание, че е важно да имате едновременно отваряща и затваряща къдрави скоби ({и}) около стила на всеки елемент h2 {color: red;}. Също така трябва да сте сигурни, че стилът на вашия елемент е между маркерите за стил за отваряне <style> и затваряне </style>. И накрая, не забравяйте да добавите точка и запетая в края на всеки от стиловете на вашите елементи h2 {color: red;}.
Вашата задача е: Изтрийте атрибута за стил в h2 елемента и вместо това създайте елемент с CSS style. Добавете необходимите CSS, за да превърнете всички h2 елементи в синьо/blue.
Ако всичко сте направили правилно натискайки Run tests бутона ще видите екрана за успех!
Можете да преминете към урок: Use a CSS Class to Style an Element
Всички теми от Responsive Web Design>>.