Change Image with CSS

HTML & CSS
1

Hello

I try change the image with this code css, but don’t worked. Any suggestions?

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain('sitepoint.com') {

img[src*="forum_new-48.png"] {
	background: url("http://imageshack.us/scaled/landing/94/k1x3pv.png") no-repeat !important;
}
}

Result:

Thanks!

2

Hi there,

And welcome to the forums.

What exactly is it you are trying to achieve here?
The background property is shorthand property used to apply various background effects to an element, such as a <div>
I’m not sure it really makes sense to apply a background image to an image.

3

I’m trying create a theme in offile mode. The solution for my question is:

img[src*="original_image"]{
    background-image: url("new_image") !important;
    background-repeat: no-repeat !important;    
    width:25px !important;
    display:inline-block !important;
    padding:25px 0 0 0 !important;
    height: 0px !important;
}

I have one more question, it is possible to add a button next to the ‘quote’? Only with CSS offline mode. For create a theme

4

Well, I’m glad you managed to find a solution to your original problem, but I still can’t see any practical value to replacing one image with another in this way.
Also, what’s going on with the height:0px?

I wouldn’t know how to add an element to a page using CSS.
You can do this easily enough with JavaScript (or just in the HTML), but that doesn’t deem to be what you’re asking.

Can anyone else shed any light??

5

I managed to put the image, but missing the link to picture.

.postarea :before{
content: url(“link_here”);
}