Dreamweaver CS4 Resources
|
Set alternating background colors in a repeating table
After you
insert a repeating table in a template, you can customize it by
alternating the background color of the table rows.
- In the Document window, select a row in the repeating
table.
- Click the Show Code View or Show Code And Design Views
button in the Document toolbar so you can access the code for the
selected table row.
- In Code view, edit the <tr> tag
to include the following code:
<tr bgcolor="@@( _index & 1 ? '#FFFFFF' : '#CCCCCC' )@@">
You
can replace the #FFFFFF and #CCCCCC hexadecimal
values with other color choices.
- Save the template.
The following is a code example of a table that includes
alternating background table row colors:
<table width="75%" border="1" cellspacing="0" cellpadding="0">
<tr><th>Name</th><th>Phone Number</th><th>Email Address</th></tr>
<!-- TemplateBeginRepeat name="contacts" -->
<tr bgcolor="@@(_index & 1 ? '#FFFFFF' : '#CCCCCC')@@">
<td> <!-- TemplateBeginEditable name="name" --> name <!-- TemplateEndEditable -->
</td>
<td> <!-- TemplateBeginEditable name="phone" --> phone <!-- TemplateEndEditable -->
</td>
<td> <!-- TemplateBeginEditable name="email" --> email <!-- TemplateEndEditable -->
</td>
</tr>
<!-- TemplateEndRepeat -->
</table>
|