HTML table

ONLINE HELP
FOR WINDEV, WEBDEV AND WINDEV MOBILE

Version:

Home | Sign in | English

Help

Editors

Controls (window/page/report)

Page

HTML table

Overview

Creating an HTML table

Using an HTML table

Handling an HTML table

Resizing an HTML table

Editing the style of an HTML table

See also

The HTML control

HTML table

Overview

The HTML table is a control used to easily create specific layouts in the HTML pages. The HTML table cannot be used to position the controls but it allows you to present the information.

For example, the HTML tables enable you to create enumerations with borders and columns.

Creating an HTML table

To create an HTML table:

select "Insert .. HTML table".
click .

Versions 15 and later
In the wizard, select the characteristics of the HTML table to create:

Number of rows.
Number of columns.
Style of table and alternation of rows and columns.

New in version 15
In the wizard, select the characteristics of the HTML table to create:

Number of rows.
Number of columns.
Style of table and alternation of rows and columns.

In the wizard, select the characteristics of the HTML table to create:

Number of rows.
Number of columns.
Style of table and alternation of rows and columns.

To create an HTML table:

on the "Creation" pane, in the "Containers" group, click "Table". In the wizard, select the characteristics of the HTML table to create:
- Number of rows.
- Number of columns.
- Style of table and alternation of rows and columns.
on the "Creation" pane, in the "Containers" group, expand "Table" and select the number of table rows and columns. In the wizard, select the style characteristics for the table as well as the alternation of rows and columns.

When the HTML table is created in the page, you can:

move it with .
handle its description via the popup menu of control. The popup menu of allows you to handle the table, the popup menu of a cell allows you to handle the table cells.

Using an HTML table

A control can be included in each cell of an HTML table. The control and the cell have the same size. The control and the cells have the same border and background properties.

Several controls cannot be included in the same cell of an HTML table.

However, an HTML cell containing several controls can be included in a cell of an HTML table.

Handling an HTML table

Selecting a cell

To select an empty cell, you must:

Move the mouse cursor over the cell.
Click inside the cell when the mouse cursor turns into a diagonal black arrow. The cell is selected: hatch marks appear in the cell.

In this case, the "Description" option found in the popup menu of the table will allow you to access the description of the cell.

To select a cell associated with a control, all you have to do is select the control.
In this case, the "Description" option found in the popup menu of the table will allow you to access the description of the control.
To find out the description of the call, select "HTML table .. Description" from the popup menu.

Selecting a column or a row

To select a column or a row, you must:

Position the mouse cursor at the end of the column or row.
Click when the mouse cursor turns into a vertical black arrow (for a column) or a horizontal black arrow (for a row). The row or the column is selected: hatch marks appear.

The popup menu allows you to:

split the selected element vertically or horizontally
merge the different parts of the selected element.

Deleting an HTML table

To delete an HTML table, select "HTML table ..Delete the table" from the popup menu.

Resizing an HTML table

Modifying the number of cells in the table

To modify the number of cells in an HTML table, you can:

add rows or columns one by one via the popup menu ("HTML table .. Insert a row" or "HTML table .. Insert a column")
add several rows or columns via the popup menu ("HTML table .. Enlarge the table")

Resizing the table

The size of the table can be modified according to two methods:

By enlarging or reducing all the table rows/columns proportionally: to do so, reduce or enlarge the table by using the handle in the middle of the last row or column.
by enlarging or reducing the size of the last table row/column: to do so, reduce or enlarge the table by clicking the edge of the last row or column.

Editing the style of an HTML table

You have the ability to separately edit the characteristics of the border and background of the HTML table and the characteristics of each one of the cells found in the HTML table. The properties about the style of the border and the style of the background are the same as for the other controls. See Advanced borders for more details.

Versions 15 and later
The style of each element found in the HTML table can also be modified. To do so:

Display the description window of the HTML table.
In the "Style" tab, select the element to customize in the "Element" combo box.
The properties that can be configured for the selected element are displayed.

Note: The "Style" tab can also be used to start a wizard for creating an automatic style for the HTML table. All you have to do is click the "Start the wizard for style creation" link.

New in version 15
The style of each element found in the HTML table can also be modified. To do so:

Display the description window of the HTML table.
In the "Style" tab, select the element to customize in the "Element" combo box.
The properties that can be configured for the selected element are displayed.

Note: The "Style" tab can also be used to start a wizard for creating an automatic style for the HTML table. All you have to do is click the "Start the wizard for style creation" link.

The style of each element found in the HTML table can also be modified. To do so:

Display the description window of the HTML table.
In the "Style" tab, select the element to customize in the "Element" combo box.
The properties that can be configured for the selected element are displayed.

Note: The "Style" tab can also be used to start a wizard for creating an automatic style for the HTML table. All you have to do is click the "Start the wizard for style creation" link.