Building a better web site ...
Questy's, HTML Using Tables
| |
Building a better web site ... Questy's, HTML Using Tables |
|
Tables are very useful for presentation of tabular information as well as a way for creative HTML authors to organize their regular Web pages. The <TABLE> tag is used to declare the start and end of a table. All table elements are placed between the <TABLE> opening and closing tags. (If the BORDER attribute is present, your browser displays the table with a border.) The <TD> tags adds what are equivalent to vertical columns to a table. Each time a table row is created using the <TR> tag, that row can be divided into vertical columns or cells by using the <TD> tag. The
code to create the one row/two cell table would look similar to the code
below: Commonly
used attributes of the <TR> tag are: Commonly
used attributes of the <TD> tag are: Use the VALIGN attribute to specify vertical alignment of an item within a cell such as text that is vertically centered. This attribute supports top, middle, bottom, and baseline as values. The ALIGN differs from the VALIGN attribute in that it aligns horizontally within a cell. ALIGN supports the values left, center, right and justify. To add a background color, use the BGCOLOR attribute using the hexadecimal code for the color. The COLSPAN attribute is used with the <TD> tag to define how many columns wide a cell should be. For example, this code, <TD COLSPAN="3">, means that this table cell will span three columns. To define table cells that will span over a specified amount of rows use the ROWSPAN attribute. This code, <TD ROWSPAN="3">, specifies that this table cell spans three rows. Other table tags that are used, but not manditory include: <CAPTION> ... </CAPTION> defines the caption for the title of the table. The default position of the title is centered at the top of the table. The attribute ALIGN=BOTTOM can be used to position the caption below the table. Any kind of markup tag can be used in the caption. <TH>
... </TH> defines a table header cell. By default the text in this
cell is bold and centered. Table header cells may contain other attributes
to determine the characteristics of the cell and/or its contents. Nesting tables provides Web designers a way to further subdivide their table space. If more than three tables are nested into one main table, it could be that the overall design of the table needs to be reconsidered. Too many nested tables can cause pages to load slowly. Borderless Page Structure By default, an 8 pixel gap exists between the content of a Web page and the border of a browser window. This gap can be completely eliminated in Internet Explorer, but only reduced in Netscape Navigator. To eliminate the gap that appears between page content and the edge of a browser window in Internet Explorer, set the TOPMARGIN and LEFTMARGIN attributes in the <BODY> tag to zero. A similar code can be used to reduce the gap in Netscape Navigator. However, the attributes would be different than those used for Internet Explorer browsers. For Netscape Navigator, set the MARGINHEIGHT and MARGINWIDTH attributes to zero. The code would be as follows: <BODY MARGINHEIGHT="0" MARGINWIDTH="0"> Using table borders with images and colors can create an impressive display as well. Use the example tables on the next page to experiment and see what you like. |
|
|
|
 |
Welcome
to the World of Questy |
