html - 如何在 CSS 中定位 div 的特定 <img> 元素？

Question

我有一些这样的代码:

<div id="foo">
 <img src="bar.png" align="right">
 <img src="cat.png" align="right"> 
</div>

现在我的问题是，如果有上述代码，我如何在 CSS 中定位特定图像？

Answer 1

这完全取决于您要定位的图像。假设它是第一个(尽管两者的实现相似)图像:

#foo img[src="bar.png"] {
    /* css */
}


#foo img[src^="bar.png"] {
    /* css */
}

#foo img:first-child {
    /* css */
}

#foo img:nth-of-type(1) {
    /* css */
}

引用资料:

• CSS3 selectors .