Previous Next

HTML Backgrounds

 

HTML background can be changed using following two ways:

  • Html Background with Colors
  • Html Background with Images

 

HTML Background with Colors

The bgcolor attribute is used to control the background of an HTML element. 

Example

<!DOCTYPE html>
<html>
<head>
<title>HTML Background Colors</title>
</head>
<body>

<!-- Format 1 - Use color name -->
<table bgcolor="yellow" width="100%">
<tr><td>
This background is yellow
</td></tr>
</table>
 
<!-- Format 2 - Use hex value -->
<table bgcolor="#6666FF" width="100%">
<tr><td>
This background is sky blue
</td></tr>
</table>
 
<!-- Format 3 - Use color value in RGB terms -->
<table bgcolor="rgb(255,0,255)"  width="100%">
<tr><td>
This background is green
</td></tr>
</table>

</body>
</html>

Result:

This background is yellow
This background is sky blue
This background is green

 


  

HTML Background with Images

The background attribute can also be used to control the background of an HTML elmement.

 

Example

<!DOCTYPE html>
<html>
<head>
<title>HTML Background Images</title>
</head>
<body>

<!-- Set table background -->
<table background="/images/html/flower.jpg" width="100%" height="100">
<tr><td>
This background is filled up with HTML image.
</td></tr>
</table>
 
</body>
</html>

 


 

HTML Pattern Backgrounds

Pattern can be defined as background for tables or html pages.

For pattern using image as small as possible is recommended for quick loading.

 

Example

<!DOCTYPE html>
<html>
<head>
<title>HTML Background Images</title>
</head>
<body>

<!-- Set a table background using pattrern -->
<table background="/images/pattern1.gif" width="100%" height="100">
<tr><td>
This background is filled up with a pattern image.
</td></tr>
</table>
 
</body>
</html>

Previous Next