仅将图像调整到特定大小答案

【问题标题】：resize images over a certain size only仅将图像调整到特定大小
【发布时间】：2017-06-09 09:06:58
【问题描述】：

我正在使用 Wordpress 插件从其他使用 RSS 源的网站导入博客文章。导入的帖子包含我使用 css 设置为统一大小的图像

img {
    width:200px !important;
}

这可以正常工作，因为仅设置宽度大小，高度调整为原始图像的正确比例，并且 !important 会覆盖导入帖子中设置的图像大小。

但是，我不想调整大小的导入帖子（例如来自 feedburner 等）中也有社交媒体共享图像，例如

我可以为 css 图像大小添加一个过滤器以仅适用于超过特定大小（例如超过 100 像素宽）的图像吗？

注意我尝试在标题中添加这个

<script type = "text/javascript" language = "javascript">
 $(document).ready(function() {
	$("myDivClass").css(img{ width:200px !important;});
 });
</script>

包含我要调整大小的图像的 div 在哪里

&lt;DIV class="myDivClass"&gt;

但这没有用。

【问题讨论】：

很有趣，但我从来没有看过css可以实现，也许你可以尝试使用javascript或wordpress插件。
可以设置类名吗？如果没有，那么您可以仅通过 css 定位社交媒体图像吗？喜欢 img[src=*"facebook.png"]

标签： css wordpress

【解决方案1】：

您必须使用 div 类选择图像。

例如你的代码是：

<div class="parentofall">
    <div class="firstparent">
        <img src="imageurl">
    </div>
    <div class="secondparent">
        <img src="imageurl">
    </div>
    <div class="thirdparent">
        <img src="imageurl">
    </div>
</div>

你的 CSS 应该是这样的：

.parentofall .firstparent img {
    width: 100px;
    height: 100px;
}

要选择选定的图像，或者您可以简单地选择没有 parentofall 的 firstparent。

转到所选图像的另一种方法是：

.parentofall > firstparent img {
width: 100px;
height: 100px;
}

【讨论】：

div 嵌套了大约 12 层深，有什么方法可以在不指定父 div 的情况下在 css 中引用它？

【解决方案2】：

最后用了这个

    <script>
	
    $( document ).ready(function() {
		$(".MyDivClass img").width(200); 
    });
	
    </script>

【讨论】：