Jump to content
Paul Verizer

BG issues (very basic)

Recommended Posts

I'm trying to learn CSS and am using the w3 tuts. However, I can't seem to get my background image to show up. I can color the bg, but can't figure out what's wrong with my code or image location. The rest of the CSS is working.

 

Thanks for looking.

 

Root folder contains "index.html" and the image, "levitating_maus.jpg"

 

<!DOCTYPE html><html><head><style>body {background-image:url("levitating_maus.jpg");}h1{color:orange;text-align:center;}p{font-family:"Times New Roman";font-size:20px;}</style></head><body><h1>CSS example!</h1><p>This is a paragraph.</p></body></html>

 

 

Share this post


Link to post
Share on other sites

OK, put the image in a folder and changed the style code to this:

<style>body {background-image:url("images/levitating_maus.jpg");}</style>

and it works.

 

However, when I move the CSS to an external stylesheet located in the root, the image doesn't show...

 

HTML:

<!DOCTYPE html><html><head><link rel="stylesheet" type="text/css" href="mystyle.css"></head><body><h1>Hello World!</h1></body></html>

 

External CSS:

<style>body {background-image:url("images/levitating_maus.jpg");}</style>

 

Thanks for looking...

Edited by Paul Verizer

Share this post


Link to post
Share on other sites

You have to be very careful with case-sensitivity on Linux servers. Also sometimes a leading ./ on the path seems to help it find an item in the current directory.

Edited by davej

Share this post


Link to post
Share on other sites
<style>body {background-image:url("images/levitating_maus.jpg");}</style>

 

 

IS this typo error? you would not have style tags in a external css document

Share this post


Link to post
Share on other sites

 

IS this typo error? you would not have style tags in a external css document

Not a typo error. JUST AN ERROR! That seems to have fixed it.

I guess the html was looking past the style tags for the selectors and declarations I put in the css, but not for the background image.

 

Anyway, now on to bigger and better mistakes.

 

Thanks, posters.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...