How to: Create and Edit HTML Tables in Design View

The HTML Designer provides tools that make it easy to create and edit tables in your Web pages.

Note

This topic discusses the HTML table element, which is frequently used to create page layouts and to display data in columns. To create tables dynamically, use the Table ASP.NET Web server control. For details, see Table, TableRow, and TableCell Web Server Control Overview.

Procedures

To create a table from the Toolbox window

• In the Toolbox, from the HTML group, drag a Table element onto the page.

To create a table from the Layout menu

1. On the Layout menu, click Insert Table.

2. In the Insert Table dialog box, specify the table properties, and then click OK.

   Note

   If the table does not have a border, you can choose Visible Borders on the View menu to display border outlines.

To add content to a table cell

• In Design view, place the insertion point in the cell in which you want to add content, and then type the text.

To add columns, rows, and cells to a table

1. Place the insertion point in a cell in the column or row next to where you want to insert the new column, row, or cell.

   Note

   Placing the cursor inside a cell is sufficient. You do not have to select the entire column, row, or cell.

2. On the Layout menu, click Insert, and then click the appropriate command to insert a column, row, or cell.

   Note

   You can also right-click the column or row, click Insert, and then click the appropriate command.

To select tables, columns, rows, or cells

1. Place the insertion point in a cell in the table, column, or row that you want to select.

2. On the Layout menu, click Select, and then click Table, Column, Rows, or Cell.

To merge cells

1. Select the cells that you want to merge.

   Note

   Press the CTRL key while clicking adjoining cells to select them.

2. Right-click the selected cells, and then on the shortcut menu, click Merge Cells.

   The cells are merged into a single cell that spans the width of the original cells.

To resize table elements

1. Right-click the row or column, click Select, and then click the element that you want to resize.

2. Drag the element's borders it is the desired size.

   The table displays the size of the element that you are resizing.

   Note

   If the selection includes elements that use different size units (for example, percentage and pixels), resizing the element changes the size units of all elements to pixels.

See Also

Reference

Insert Table Dialog Box