How to add a background image to HTML page

Written by christine argier Google
  • Share
  • Tweet
  • Share
  • Pin
  • Email
How to add a background image to HTML page
Use HTML code to create websites. (Comstock/Comstock/Getty Images)

Numerous Web pages are written in Hypertext Markup Language (HTML) code. HTML consists of a series of tags that instructs a Web browser about how to display the site on your screen. If you are creating an HTML page, you can specify a background image in the <body> tag.

Skill level:


  1. 1

    Open the image that you want to use in an image-editing program. Click "Save As" and save the file as a JPEG.

  2. 2

    Upload the image to your website using your host's FTP client. Note the location and file name of the image once it is uploaded.

  3. 3

    Paste this code into your HTML between the <body> tags: <body background="image.jpg">. Replace "image.jpg" with the file name and location of your background image. If the image is located in the same directory as your HTML file, you only need to specify the file name. If the image is located in another directory, the correct syntax is <body background="/directory/image.jpg">.

Tips and warnings

  • The browser will automatically tile the background image so it fills the entire screen.
  • Make sure to include the quotation marks in your HTML code to avoid a syntax error.
  • You can tell the browser to display a solid colour in the background as the image loads if you modify the tag as follows: . Replace "colour" with the desired background colour.

Don't Miss

  • All types
  • Articles
  • Slideshows
  • Videos
  • Most relevant
  • Most popular
  • Most recent

No articles available

No slideshows available

No videos available

By using the site, you consent to the use of cookies. For more information, please see our Cookie policy.