HTML
<!DOCTYPE html>
<html>
<head>
<title>Испытание: наведение порядка</title>
<meta charset="utf-8">
<style>
div .cat-foodlove {
background-image: url("cat-vampire.svg");
background-color: fuchsia;
}
#scary {
background-image: url("cat-skull.svg");
}
.gallery .cat-fat {
background-image: url("cat-fish.svg");
width: 90px;
height: 80px;
}
div.cat-cage {
background-image: url("cat-hiss.svg");
border-color: lawngreen;
}
</style>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="gallery">
<div class="picture cat-foodlove">Мечты о еде</div>
<div class="picture cat-slippers" id="scary">Где тапки?</div>
<div class="picture cat-fat">После обеда</div>
<div class="picture cat-cage" style="color: red;">Люблю птиц</div>
</div>
</body>
</html>
CSS
html,
body {
margin: 0;
padding: 0;
}
body {
width: 550px;
font-size: 14px;
font-family: "Tahoma", "Arial", sans-serif;
color: black;
}
.gallery {
display: flex;
flex-wrap: wrap;
width: 300px;
padding: 10px;
}
.gallery .picture {
width: 100px;
height: 100px;
margin: 10px;
padding: 10px;
border: 5px solid burlywood;
text-align: center;
background-repeat: no-repeat;
background-position: 50% 80%;
background-size: 64px 64px;
background-color: white;
border-radius: 10px;
}
div .cat-foodlove {
background-image: url("cat-foodlove.svg");
}
#scary {
background-image: url("cat-slippers.svg");
}
div .cat-cage {
background-image: url("cat-cage.svg");
}
.gallery .cat-fat {
background-image: url("cat-fat.svg");
}
Каким образом можно поменять цвет шрифта в CSS, если в HTML <div class="picture cat-cage" style="color: red;">Люблю птиц</div>