wordpress - 使用 CSS 仅调整帖子中第一张图片的大小而不影响任何其他图片

Question

如何使用 CSS 仅调整帖子中出现的第一张图片的大小，而不影响帖子中的任何其他图片。如果我使用以下代码:

#content div.single:nth-of-type(n) img {
width: 448px !important;
height: 252px !important;
padding: 0 !important;
margin-top: 0;

它会调整帖子中所有图片的大小。

我也尝试过 nth-child 但没有成功:

#content div.single img:nth-child(1){
width: 448px !important;
height: 252px !important;
padding: 0 !important;
margin-top: 0;}

这里是 the Demo

Answer 1

为什么不像这样定位您想要的图像:

.alignnone.size-full.wp-image-35095 {
width: 448px !important;
height: 252px !important;
padding: 0 !important;
margin-top: 0;
}

当你有一个带空格的类时，你在 css 中定位该类，但你用一个点更改每个空格。

如果您希望始终以帖子中的第一张图片为目标，那么您可以运行 Jquery:

$( "#content img" ).first().attr('width', '150');

顺便说一句，你的第一张图片很重要，我一直在纠结为什么这不起作用:P