CODEWITHSUNDEEP
htmlcssimagecss-selectorshide
mikezang
mikezang

Reputation: 2489

How to use css/html to hide image with src like *-1.jpg or *-1.gif?

I want to hide some images in tag img src, they have name look like *-1.jpg, *-2.jpg or *-1.gif, how can I do it? I found some answer as below, but I am not sure how to use them for my question...

img[src='']{
    display: none;
}
img[src='Error.src']{
    display: none;
}

I hope to hide img src, but show a href, is this possible?

<a href="http://www.brickshelf.com/gallery/mikezang/clonebrick/stardiamond/80029.jpg" title="星钻／军事／CV-12 侦察吉普车&lt;br /&gt;Star Diamond／Military／CV-12 Reconnaissance Vehicle">
<img src="http://www.brickshelf.com/gallery/mikezang/clonebrick/stardiamond/80029.jpg" height="64" />

Upvotes: 3

Views: 2120

Answers (2)

James Donnelly
James Donnelly

Reputation: 128791

You can use the $= attribute selector to match the end of the src attribute.

[att$=val]

Represents an element with the att attribute whose value ends with the suffix "val". If "val" is the empty string then the selector does not represent anything.

Your question is a bit vague on exactly what you want to hide, but based on what you've provided, I think the simplest solution is to have three separate selectors to match each case:

img[src$="-1.jpg"], img[src$="-2.jog"], img[src$="-1.gif"] {
    display: none;
}

Upvotes: 1

Rohit Azad Malik
Rohit Azad Malik

Reputation: 32182

CSS has the ability to target HTML elements based on any one of their attributes. You probably already know about classes and IDs. more info

Upvotes: 0

Related Questions