HTML Tutorials
Home >> Tables >> Table Background Colors and Images
previous pageTable Backgrounds: ColorTable Backgrounds: Rows next page

Table Backgrounds: Image

Setting the background image of a table can be done easily with styles. In this page we'll look at how to set the background image of the entire table. Later we'll set the background image of individual cells.

Suppose we want to use this image as the background:

deep sea background

As in the previous example we'll first create a set of style rules. The following code goes in the <HEAD> section of the page: 


<STYLE TYPE="text/css">

<!--

.deepsea, .deepsea TD, .deepsea TH

{

background-image:url('deepsea.gif');

background-color:blue;

color:white;

font-family:sans-serif;

font-weight:600;

}

-->

</STYLE>

These rules state that for any element with its class set to deepsea, or any <TD ...> or <TH ...> within a deepsea element, there are several rules:

To apply the style to a table we simply set the table to the deepsea class with a CLASS attribute: 


<TABLE CELLPADDING=8 CELLSPACING=0 CLASS="deepsea">

which gives us this table

blah blah yeah yeah
groovy dude right on

previous pageTable Backgrounds: ColorTable Backgrounds: Rows next page


Recommended Resources

web hosting tutorials
Credit Help		 Search the Internet
Search Engine Help		 Low Fat Lifestyle
Internet Traffic		 Web Hosting
Web Design

Discount Hotel Reservations

Search The Internet

Copyright 1997-2002 Idocs Inc. Content in this guide is offered freely to the public under the terms of the Open Content License and the Open Publication License. Contents may be redistributed or republished freely under these terms so long as credit to the original creator and contributors is maintained. About the author

All Rights Reserved, Copyright © Free-HTML-Tutorials.com 2003
A service of 1stHostWeb.com