treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Add url path with CSS

  • Google has failed me with this so here it goes :)

    Is it possible to add a URL path to a image through CSS only? I can't change the HTML as it would break future updates to the page....
  • If I understand you correctly, no. You could do it with a background in your css, though, like this:
    background:("path/to/image.jpg") no-repeat;
    Could you clarify what you want?
  • Yes it is.


    p {
    content:url(your.gif);
    }



    That will set the content of all p tags to "your.gif" Just use a class or id selector to specify where to replace.
  • Let's see if this is a bit more clear, in regards to what I am asking.

    HTML:
    <img src="images/logo.gif>


    now I want to add a URL to that HTML, but only from the CSS file. I can't edit the HTML.
  • The content selector should only be used with before or after and in any case he wants it to work on a image...not apply an image,
  • You cannot pass HTML in a CSS document it's simply not possible. Your best bet is to consider looking at Javascript but of course you would need to edit the HTML header to include a JS script.
  • True and content without before or after doesn't work in FF or IE, but will in Chrome or Safari.

    But this is easy to bypass. Just put an empty span inside a div and set the image after the span.

    Like this

    But again, this isn't changing the html. So if you already have that img in your file you'll need some js added to the head to change it. and if that img doesn't have an ID or class unique to itself it will be difficult to select only that img.