Using the Html Table Control

The HtmlTable control mimics the Html <table> tag.We may define rows using <tr> tags.Table cells are defined using <td> tags.This control is a container control, and so we can embed other controls in its cells. It has the following attributes:

<table runat="server" id="programmaticID" align=left | center | right bgcolor="bgcolor" border="borderwidthinpixels"

bordercolor="bordercolor" cellpadding="spacingwithincellsinpixels" cellspacing="spacingbetweencellsinpixels" height="tableheight" rows="collectionofrows" width="tablewidth" > </table>

In the following example, as you can see in Figure 3.28, we will build an HtmlTable with two rows and two columns. Each cell of the table will contain an HtmlAnchor control.

Figure 3.28 Embedded HTMLAnchor Controls in an HtmlButton Control

Figure 3.28 Embedded HTMLAnchor Controls in an HtmlButton Control

The code for this application, as shown in Figure 3.29, is self-explanatory. Each pair of <tr> and </tr> entries enable us to define a row, and within each row, we nest a pair of <td> </td> to define the table's data (cell). In this example, we have embedded an HtmlAnchor control in each cell.The code shown in Figure 3.29 is available in the accompanying CD in a file named HtmlAnchor1.aspx.

Figure 3.29 HtmlAnchorl.aspx

<!— Chapter3\HtmlAnchor1.aspx —> <html><head></head><form runat="server">

<table style= width: 170px; height: 50px" cellSpacing="0" cellPadding="5" width="170" border="4"> <tr><td><a id="anchor1" runat="server"

href="">Syngress Home</a>

<td><a id="acnhor2" runat="server"



Figure 3.29 Continued

Syngress Catalog</a>

<tr><td><a id="anchor3" runat="server"

href=""> Syngress Demo </a>

<td><a id="anchor4" runat="server"

href=""> Syngress Specials</a> </td> </tr>

0 0

Post a comment