Question

提前感谢您的帮助！

我有一个RSS，我想在我的页面上发布这个RSS的内容，但RSS来自WordPress，它包含一个评论按钮的图像。

问题1：如果我隐藏RSS中的每个<img>，我也会隐藏博客上发布的文章中的图像。

问题2：评论按钮<img>网址是连续的，所以即使我可以隐藏“wordpress.com/comments/ ... 12”，下一个按钮<img>网址也是“wordpress”。 com / comments / ... 13“等等：（

图片的HTML：

<img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/mulleralc.wordpress.com/35/">

有一种方法可以识别评论按钮图像：它是72像素×16像素。所以，我需要隐藏我页面上的每张图片，即72（宽）x 16（高）。有没有办法在CSS或JavaScript中执行此操作？

因为我们有这样的编码：

img[src~="http://...url..."] {display: none;}

也许有类似的东西：

img[height="16"] {display: none;}

Answer 1

注释按钮URL是顺序的，所以即使我可以隐藏“wordpress.com/commentbutton/12”，下一个按钮网址是“wordpress.com/commentbutton/13”，依此类推：（

CSS实际上可以帮到这里。属性选择器可以选择包含值的属性。所以，这个：

img[src*="feeds.wordpress.com/1.0/comments"] {display: none;}

应该这样做。

Answer 2

我建议使用多个属性选择器，在这种情况下，将以下代码添加到CSS样式表中：

img[width="72"][height="16"] {
    display: none;
}

这种方法的唯一问题是它wouldn't work in older browsers（例如IE 6）因为它们无法识别它们。

如果您使用的是JavaScript库jQuery，则可以使用以下脚本：

$('img').each(function () {
    'use strict';
    var img = $(this);

    if (img.width() === 72 && img.height() === 16) {
        img.hide();
    }
});

Answer 3

使用多个属性选择器。

您的图片代码必须使用width和height属性才能生效。

HTML 的

<img src="your-image.jpg" width="72" height="16" />

CSS

img[width="72"][height="16"] {
     display: none;
}

或

如上所述，请使用CSS类。

HTML 的

<img class="hide-from-rss" src="your-image.jpg" width="72" height="16" />

CSS

.hide-from-rss { display: none; }

Answer 4

CSS无法做到这一点。它不知道你的页面上有多大的图像。你需要JavaScript来解决这个问题。

通过CSS隐藏特定大小的图像？

4 个答案: