html - 以不同方式在 div 中设置两个图像的样式

Question

想要在一个 div 中设置两个图像的样式并为它们提供不同的 CSS 样式。

<div id="l1">
 <h4>Thorlax Comfort Socks </h4>
 <img src="images/comfortSocks.png">
 <p> These socks offer you the best in comfort. 
 <h3> $9.99 </h3>
 <img src="images/CheckItOut.png">
</div>

我该如何为两张图片赋予不同的样式属性。以下是我通常会如何去做。我如何只定位底部图像，即“images/CheckItOut.png”

l1 img { etc etc etc
}

如有任何帮助，我们将不胜感激。我觉得这是一个简单的问题，但我以前没有遇到过这个问题。

Answer 1

给每个图像一个类，并为每个类设置样式。例如:

<img src="images/comfortSocks.png" class="socks">
<img src="images/CheckItOut.png" class="checkitout">

然后是你的 CSS

img.socks {
    ....
}
img.checkitout {
    ....
}