Javascript 如果一个.gif文件位于另一个.gif文件旁边,则将其隐藏

Javascript 如果一个.gif文件位于另一个.gif文件旁边,则将其隐藏,javascript,html,css,css-selectors,Javascript,Html,Css,Css Selectors,我有一个服务,人们可以上传他们的图片,我把它们显示在我的网站上。我想自动隐藏一个.gif,如果它是在另一个.gif旁边上载的 我不希望这会影响以.png或.jpg结尾的图像。。仅限.gifs 下面是一个图像示例 如果一行中有三个.gif,则仅显示第一个 我试着选择它,并隐藏它,但这根本不起作用 img > .gif{ display:none; } 我需要使用JavaScript或jQuery来实现这一点吗?您可以使用纯CSS来实现这一点-不需要JavaScript/jQuer

我有一个服务,人们可以上传他们的图片,我把它们显示在我的网站上。我想自动隐藏一个
.gif
,如果它是在另一个
.gif
旁边上载的

我不希望这会影响以
.png
.jpg
结尾的图像。。仅限
.gifs

下面是一个图像示例

如果一行中有三个
.gif
,则仅显示第一个

我试着选择它,并隐藏它,但这根本不起作用

img > .gif{
    display:none;
}

我需要使用JavaScript或jQuery来实现这一点吗?

您可以使用纯CSS来实现这一点-不需要JavaScript/jQuery

使用和的组合:
+
1

这将设置
显示:无.gif
之后的任何
gif
上的code>。因此,最多不会有两个
.gif
出现在彼此旁边

img[src$=".gif"] + img[src$=".gif"] { 
    display:none;
}


1属性选择器和直接相邻组合器的使用由IE8和down提供。

只需编写:

.gif + .gif {
    display: none;
} 

您可以使用@Tomzan的答案作为CSS选择器:Element+Element(由于声誉不高,我无法发表评论)[http://www.w3schools.com/cssref/sel_element_pluss.asp]:

.gif + .gif { display: none; } 
或者没有自定义类@yours CSS():

从W3c获取此答案的所有CSS选择器:

注:对于要在IE8及更早版本中工作的element+element,a<!DOCTYPE> 必须申报

更新
第一,使用CSS类对IE7有用:

如果一行中有三个或更多GIF,那么应该只有一个可见吗?是的。如果一行中有3个,你可以看到我的图像,只显示第一个。很好地使用“属性结束于”选择器,但这不会隐藏除了第一个gif以外的所有内容吗?我认为OP需要澄清。这是根据提供的图片。@WesleyMurch感谢您的帮助。一行中的3应该只显示催眠生成的化身的最后一个+1。请注意,您无法编写一个动态选择器,该选择器将在具有相同属性值的另一个元素之后拾取具有该属性值的元素-如果您需要将此应用于所有图像格式,则需要为每种格式重复选择器。对-它肯定会工作,但这需要一个不必要的类。抱歉,刚才我看到了你的安威尔:它和我的非常接近。我可以删除我的帖子,你可以添加W3参考,你觉得呢?(由于声誉问题,我无法发表评论,bleh:P)另外,有两种方法可以实现这一点:使用类或使用属性。CSS类可以在旧浏览器(IE7)上工作,相邻的选择器也可以在IE7上工作,但是[attribute$=“value”]不起作用。无论如何,对不起,乔希,下次我会更小心的。
img[src*=".gif"] + img[src*=".gif"] {display: none}