More CSS selectors-multiple css classes: a classy gallery challenge
Hi all,
I don't usually like to ask for help but I just can not get past this challenge. The challenge is telling me that I am almost there but I am stuck. Your help will be much appreciated.
Here is the challenge:
Add multiple classes
This webpage has three images in the body, but there are no styles yet.
We've defined a few CSS rules with class selectors at the top. Some of the rules change the size of the image, and others change the border.
Your challenge: is to add two class names to each image so that the sizes and borders vary from each other. Mix and match - try a few out!
Hint What's this?
<img class="...">
And here is my code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Challenge: A classy gallery</title>
<style>
body {
font-family: cursive;
}
.image-small {
width: 150px;
}
.image-medium {
width: 200px; }
.image-large{width:250px;}
.black-frame {
border: 8px double rgb(38, 38, 38);
}
.gold-frame {
border: 10px ridge rgb(255, 183, 0);
}
.silver-frame {
border: 10px groove rgb(204, 204, 204);
}
</style>
</head>
<body>
<h1>A classy gallery</h1>
<img class="small-frame gold-frame" src="https://www.kasandbox.org/programming-images/animals/cat.png">
<img class="medium-frame silver-frame" src="https://www.kasandbox.org/programming-images/animals/fox.png">
<img class="large-frame black-frame" src="https://www.kasandbox.org/programming-images/animals/penguins.png">
</body>
</html>
Влезте в услугата, за да оставите коментар.