Change Image - CSS

  • (2 Pages)
  • +
  • 1
  • 2

23 Replies - 5370 Views - Last Post: 18 December 2012 - 05:13 PM

#1 Mortal Kombat  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 16
  • Joined: 16-December 12

Change Image - CSS

Posted 16 December 2012 - 10:34 AM

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('warez-bb.org') {

img[src*="http://img9.warez-bb.org/wbb3_theme/images/folder.gif"] {
	background: url("http://imageshack.us/scaled/landing/94/k1x3pv.png") no-repeat !important;   
}
}


Result:

Posted Image

Thanks!

Is This A Good Question/Topic? 0
  • +

Replies To: Change Image - CSS

#2 Vompaudi  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 43
  • Joined: 23-November 12

Re: Change Image - CSS

Posted 16 December 2012 - 12:06 PM

That is not CSS syntax...please look from http://www.w3schools.com/css/ right way.
Was This Post Helpful? -1
  • +
  • -

#3 Mortal Kombat  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 16
  • Joined: 16-December 12

Re: Change Image - CSS

Posted 16 December 2012 - 12:35 PM

View PostVompaudi, on 16 December 2012 - 12:06 PM, said:

That is not CSS syntax...please look from http://www.w3schools.com/css/ right way.


With only CSS, i cannot change the image. Can you help me?

I'm trying to change a layout, in offline mode using Manager Styles for Firefox.
Was This Post Helpful? 0
  • +
  • -

#4 Vompaudi  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 43
  • Joined: 23-November 12

Re: Change Image - CSS

Posted 16 December 2012 - 12:42 PM

First of all, [] and * marks in your code. They are not CSS syntax. "no-repeat !important;" what this should be done? There is not tag such as important. And what that exclamation mark is doing?

And how you want, that picture changes? There is hover function for when cursor is on top of image.

This post has been edited by Vompaudi: 16 December 2012 - 12:46 PM

Was This Post Helpful? -1
  • +
  • -

#5 Mortal Kombat  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 16
  • Joined: 16-December 12

Re: Change Image - CSS

Posted 16 December 2012 - 02:22 PM

View PostVompaudi, on 16 December 2012 - 12:42 PM, said:

First of all, [] and * marks in your code. They are not CSS syntax. "no-repeat !important;" what this should be done? There is not tag such as important. And what that exclamation mark is doing?

And how you want, that picture changes? There is hover function for when cursor is on top of image.


Solved!

img[src*="normal_post.gif"]{
    background-image: url("http://imageshack.us/scaled/landing/94/k1x3pv.png") !important;
    background-repeat: no-repeat !important;    
    width:30px !important;
    display:inline-block !important;
    padding:30px 0 0 0 !important;
    height: 0px !important;

Was This Post Helpful? 2
  • +
  • -

#6 IJET  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 93
  • View blog
  • Posts: 121
  • Joined: 14-October 12

Re: Change Image - CSS

Posted 16 December 2012 - 02:25 PM

@Vompaudi First off, chill. If you want to help, then post accurate advice. That is CSS he is using and !important does exist. I suggest you go to W3 yourself and do some browsing.

@MortalKombat Hello! It looks alright, perhaps check and see if your locations are correct? Such as the url("http:") src*="" etc.

edit:: nevermind, took too long on my coffee break. lol :-P

This post has been edited by IJET: 16 December 2012 - 02:27 PM

Was This Post Helpful? 3
  • +
  • -

#7 Mortal Kombat  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 16
  • Joined: 16-December 12

Re: Change Image - CSS

Posted 16 December 2012 - 02:31 PM

View PostIJET, on 16 December 2012 - 02:25 PM, said:

@Vompaudi First off, chill. If you want to help, then post accurate advice. That is CSS he is using and !important does exist. I suggest you go to W3 yourself and do some browsing.

@MortalKombat Hello! It looks alright, perhaps check and see if your locations are correct? Such as the url("http:") src*="" etc.

edit:: nevermind, took too long on my coffee break. lol :-P


LOL. Thanks for trying to help!
Was This Post Helpful? 1
  • +
  • -

#8 IJET  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 93
  • View blog
  • Posts: 121
  • Joined: 14-October 12

Re: Change Image - CSS

Posted 16 December 2012 - 02:34 PM

Haha, I do what I can! Good luck and post back if you need anymore help. (I will make sure to answer before I take a break) :)
Was This Post Helpful? 0
  • +
  • -

#9 Mortal Kombat  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 16
  • Joined: 16-December 12

Re: Change Image - CSS

Posted 16 December 2012 - 02:38 PM

View PostIJET, on 16 December 2012 - 02:34 PM, said:

Haha, I do what I can! Good luck and post back if you need anymore help. (I will make sure to answer before I take a break) :)/>


Thank you! :scooter:
Was This Post Helpful? 0
  • +
  • -

#10 Mortal Kombat  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 16
  • Joined: 16-December 12

Re: Change Image - CSS

Posted 17 December 2012 - 09:20 AM

View PostIJET, on 16 December 2012 - 02:34 PM, said:

Haha, I do what I can! Good luck and post back if you need anymore help. (I will make sure to answer before I take a break) :)/>


I'm back. :nottalkingtoyou:

One more question, it is possible to add a button next to the 'quote'? Only with CSS offline mode. For create a theme

Example:

Posted Image
Was This Post Helpful? 0
  • +
  • -

#11 j4v3d  Icon User is offline

  • D.I.C Head

Reputation: 5
  • View blog
  • Posts: 52
  • Joined: 24-November 12

Re: Change Image - CSS

Posted 17 December 2012 - 09:59 AM

View PostMortal Kombat, on 17 December 2012 - 09:20 AM, said:

View PostIJET, on 16 December 2012 - 02:34 PM, said:

Haha, I do what I can! Good luck and post back if you need anymore help. (I will make sure to answer before I take a break) :)/>/>


I'm back. :nottalkingtoyou:/>

One more question, it is possible to add a button next to the 'quote'? Only with CSS offline mode. For create a theme

Example:

Posted Image


Is it possible to put a div next to the button and then hard code the button image in? Or just put a div and based on the id or class float it right and add the image via CSS? If you require any more help or clarification then please do get back to us :)
Was This Post Helpful? 0
  • +
  • -

#12 Mortal Kombat  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 16
  • Joined: 16-December 12

Re: Change Image - CSS

Posted 17 December 2012 - 10:32 AM

View Postj4v3d, on 17 December 2012 - 09:59 AM, said:

View PostMortal Kombat, on 17 December 2012 - 09:20 AM, said:

View PostIJET, on 16 December 2012 - 02:34 PM, said:

Haha, I do what I can! Good luck and post back if you need anymore help. (I will make sure to answer before I take a break) :)/>/>/>


I'm back. :nottalkingtoyou:/>/>

One more question, it is possible to add a button next to the 'quote'? Only with CSS offline mode. For create a theme

Example:

Posted Image


Is it possible to put a div next to the button and then hard code the button image in? Or just put a div and based on the id or class float it right and add the image via CSS? If you require any more help or clarification then please do get back to us :)/>


I will try explain...

It's thus, I am working with this addon:

https://addons.mozilla.org/pt-PT/firefox/addon/user-style-manager/?src=search


What I'm trying is to put a picture next to another with only css, using the addon only.

Without CSS:

Posted Image

With CSS:

Posted Image

Thanks
Was This Post Helpful? 0
  • +
  • -

#13 BetaWar  Icon User is offline

  • #include "soul.h"
  • member icon

Reputation: 1169
  • View blog
  • Posts: 7,218
  • Joined: 07-September 06

Re: Change Image - CSS

Posted 17 December 2012 - 11:30 AM

There is the content attribute which may come in handy, but I haven't found anything that specifically allows you to modify the DOM through CSS (nor have I been able to use the content attribute to insert anything other than text).
Was This Post Helpful? 0
  • +
  • -

#14 Mortal Kombat  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 16
  • Joined: 16-December 12

Re: Change Image - CSS

Posted 17 December 2012 - 12:07 PM

View PostBetaWar, on 17 December 2012 - 11:30 AM, said:

There is the content attribute which may come in handy, but I haven't found anything that specifically allows you to modify the DOM through CSS (nor have I been able to use the content attribute to insert anything other than text).


With this code i add image, but how add hyperlink?

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

Was This Post Helpful? 0
  • +
  • -

#15 Vompaudi  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 43
  • Joined: 23-November 12

Re: Change Image - CSS

Posted 18 December 2012 - 04:01 AM

Hyperlinks are added in HTML document. CSS are only for decorating.

For example if you want link without underline:

In HTML-document

<a href="link_address">Link text</a>


In CSS file:

#a{
text-decoration: none;
}


Was This Post Helpful? 0
  • +
  • -

  • (2 Pages)
  • +
  • 1
  • 2