StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Tips for debugging and other info, which should hopefully lead you to the correct answer:</p> <ul> <li><p>Check to see if you can see the image directly in your web browser. If the path you're using to the HTML file is, for example, "http://example.com/some/dir/index.html", then browse directly to "http://example.com/some/dir/image.jpg" and see if the image appears. If it doesn't, then your image is inaccessible, or in the wrong place, or possibly corrupt or being served with the wrong Content-Type.</p></li> <li><p>If the image is in the right place but seems inaccessible, check the file permissions first. The file should be readable by the web server. If in doubt, give it the same ownership and permissions as the HTML file you're successfully reading. (On Windows, view the properties/permissions of the file and allow everyone to read it. On Unix, try chmod 644 <code><filename></code>.)</p></li> <li><p>Consider the possibility that the image might actually be working fine, but also be a single pixel, or completely transparent, or a plain colour the same as its background, or positioned out of sight with the CSS positioning attributes.</p></li> <li><p>Try temporarily using another image, preferably one you can definitely see on the web in the web browser you're using for testing, downloaded with that browser (that will make sure there are no weird problems with the image file itself.)</p></li> <li><p>Remember that if you're defining the background in a CSS file, the path to the image is relative to that CSS file, not to the HTML file.</p></li> <li><p>The "background" attribute is deprecated in HTML. If you want to specify a background inline in the HTML, try <code><body style="background-image: url(image.jpg);" >...</body></code>. But the proper place for this would be in the CSS these days.</p></li> <li><p>You don't need "./" in front of your image location. If it's in the same directory as your HTML file, just use the name of the image, e.g. <code><body style="background-image: url(image.jpg);"></code></p></li> <li><p>Does it work as a plain image? <code><img src="background.jpg"/></code></p></li> <li><p>Sanity-check your HTML by using a very simple, valid test document, like this one:</p></li> </ul> <p><code><pre> <!DOCTYPE html> <html> <head> <title>Test</title> </head> <body style="background-image: url(http://placehold.it/350x150);"> This is a test. </body> </pre></code></p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload