These are the images that we will be using.
As a foreword to this tutorial a
Knowledge of There are two ways to accomplish this depending on where you want to use it. One is in your E-mail Signature Box and the other is on a Web Page. We will first demonstrate the E-Mail Method and will just use the The Bordered Background with The Image in a table.
The E-Mail MethodYou can not use the Bordered Background as the background for your e-mail as the side bar will cover the bordered part. The solution is to put the Bordered Background in a table and use the <ul> tags to indent your codes. Why the <ul> tags you say?The reason is quite simple really. The three available screen widths, due to the Side Bar Menu
The drawback to this method is that you will lose some of the available space, on the solid portion of the background, when you write your codes and text. This can be overcome by centering the data before it is entered. This is a small price to pay in exchange for a nice background that will view as intended on either of the 3 screens.
The number of <UL> tags used will depend on the bordered portion of the Border Background. Usually 3 are sufficent.
|
The Web Page MethodNow lets make the spacer the same width as the border you see on the left, but this time we will make the height only 1 pixel Using this information we will make a table have 2 <TD> Table Data Cells. The spacer will go in the first cell. All of our text, codes, and Images will go in the second cell. You do not need to know the width of the 2nd cell as long as you make it 100%, which represents the remaining available Table Width.
This isThe Web Page Code
<body background="sprite.gif" text="#FAF0E6" bgcolor="#0000FF" link="#0000FF" vlink="#0000FF"> You may change any of the colors to suit the background and your own preference.
The Second<TD> Table Data CellOne of the neat things we can do with this technique is to vary the background or color of the solid portion of The Bordered Background. The way to do this is to assign a background or color attribute to the 2nd Table Data Cell. Here the background that we will use
|
This isThe 2nd CellBackground Code
<table cellpadding=0 cellspacing=0 border=0 width="95%"> There is myriad of backgrounds and colors to choose from for this cell. You are only limited by your imagination. The Professor has only tried to demonstrate some of the possibilities.
|
The Professor has arranged a special presentation of to demonstrate what is possible using Bordered Backgrounds. So make yourself comfortable, get a cup of coffee, relax and enjoy the show. After the show, be sure and vist The Professor's Tutorial on
DESIGN BY |