Main
Home
Contact Staff
Request
Graphics Directory

Site
Updates Archive
Previous Requests
History
FAQ
Terms
Previous Layouts
Staff
Affiliates
Credits
Link Back

Graphics
Avatars
Banners
MS Paint
Posters
Textures
Transparencies
Wallpapers
Miscellaneous

Drifting Designs Tutorials > > Coding > > HTML > > Background





Background Color
Background Images
Fixed Image




Background Color


Background color is the color of, well, your background, obviously. For example, this webpage has a background of light blue (although this div layer has a background of light gray). The default background is white, but to customize it, paste the following code into your Body part of your webpage after the <body> tag -

<body bgcolor="addcolorhere">


Where it says "addcolorhere", put the hexadecimal of the color you want to be the background of your webpage.



Background Image


Instead of being a plain color, want your background to be of an image? Use the following code -

<body background="http://urlofyourimage.gif">


Replace "http://urlofyourimage.gif" with the url of your image.

Note: When using the above code, keep in mind that the image will "tile" across the screen if the image is too small to cover the whole page as a background by itself. To see what I'm talking about, click here.

This "tiling" attribute is sometimes liked because it results in interesting textures and designs. However, if you're not trying to get that effect, and instead want the image to not repeat, use the "Fixed" code (see below).



Background Fixed Image


Most of the time, I don't want the picture to tile, so I use a CSS code to keep the background in place and to not repeat, such as in this page. Use the below code if you do not want your image to tile. Enter this into the Head part of the page, or just add it to your existing CSS style sheet. If you do add it to your existing CSS style sheet, make sure that it is one of the first attributes listed on the sheet.

<style type="text/css"> BODY, {background: url(http://urlofyourimage.gif); background-repeat: no-repeat } </style>


Replace "http://urlofyourimage.gif" with the URL of the image you want to use as your background.

Layouts
Div Layouts
Frames Layouts
Pop-Up Layouts
Table Layouts

Neopets
Shop Signs
Guild Layouts
Full Page Layouts
Miscellanous

Tutorials
Coding
Graphics
Other

Hosted
Hosted by: