How to Resize an Image URL to Fit a Background
If you have a large image you want to use as a background image on a Web page, you can use HTML (Hyper Text Markup Language) to have the size of the image adjusted so that it fills the entire screen. This will work regardless of the screen size, or size of the browser being used to open the page. Because this technique causes the browser to re-sample the image, it may slow the speed of your Web page, so use this technique sparingly.
Other People Are Reading
Instructions
-
-
1
Upload the image you want to use as a background onto your Web server if it is not already online. Make a note of its Web address (URL) such as “http://sample.com/image.jpg.” To ensure you have the right address, open it in a Web browser and copy the address from the browser's address field.
-
2
Open the Web page using an HTML editor such as Notepad so you can see the HTML code.
-
-
3
Locate the “</head>” tag on the page. All of the code below should be placed on the lines following this tag.
-
4
Type, or copy and paste, “<body style="padding:0px; margin:0px; overflow:hidden;">” on the first line after the “</head>” tag.
-
5
Type, or copy and paste, “<div style="position:absolute; width:100%; height:100%; margin:0px; padding:0px; left:0px; right:0px;z-index:1"><img src="http://www.sample.com/image.jpg" width="100%" height="100%"></div>” on the next line. Replace the URL of the sample image here with your image’s Web address.
-
6
Type, or copy “<div style="z-index:2; position:absolute; margin:0px; padding:0px; height:100%; width:100%; overflow:scroll;">” in the next line.
-
7
Add any additional content you want in the page using the appropriate HTML code. For example, place text paragraphs between “<p>” and “</p>” tags.
-
8
Type or copy “</div></body></html>” in the last line of the page to close those tags. If you used additional tags in the content of your Web page, remember to close those tags as well.
-
9
Save your Web page as an ".html" file. Upload it to your Web server using the FTP service recommended by your Web host service provider.
-
1
