7.0

Table Of Contents
</table>
</div>
The content is enclosed by a <div> element. Each page contains a <form> tag, which is used to catch
information entered by the user or to perform an action when the user clicks a button.
The <form> tag has two main components: the actual table and the toolbar/buttons to perform specific
actions. A page will only contain a single overview table.
4.7.1 Head
The <th> tag indicates that the table cell(s) of the first row is a header cell, in this case the title for the table.
In the Style.php file an id selector with a subselector of <th> is created to avoid styling conflicts with other
tables.
#tableOverview th {
background-color: <? generateSkinMainColor(); ?>;
padding: 2px;
font-weight: bold;
text-align: left;
border-width: 0 0 1px 0;
border-color: #FFFFFF #FFFFFF #FFFFFF #FFFFFF;
border-style: solid;
color: #FFFFFF
}
4.7.2 Subhead
The second row shows the names for the columns. Often the first column contains a check box to select and
deselect (toggle) the records of the current page in the overview.
4.7.3 Content
The rows (<tr> tag) that form the body of the table have the record class selector. In hierarchical overviews a
second class selector is used to specify the level in the hierarchy. The <td> tags contained by the table row
can have different class selectors. This depends on the type of content, examples are: text, icon and check
box.
In the skins supplied with PSW the background color for the element is set when the user places the cursor
over a specific row (hovers).
#tableOverview tr.level0:hover,
#tableOverview tr.level1:hover,
#tableOverview tr.record:hover {
background-color: #E6E6FF;
}
4.7.4 Footer
The last table row is used to display navigation options. The navigation options become visible when the
overview contains more than the number of records set in the setRowsPerPage variable (default 15). Please
refer to Special variables chapter for more information about this function.
Styling - Overview tables
Objectif Lune Inc. © 2010 29