Scenario 1: Layout table having TH element |
Welcome to deque
|
|
|
Welcome to our site
Here you will learn to create websites...
|
|
copyright © deque.com
|
|
<![CDATA[<table cellpadding="10px;" cellspacing="0" style="font:12px verdana, sans-serif; width:100%;">
<tr>
<th colspan="2" style="background-color:#679BB7;">
<h1 style="font-size:18px; margin:10px 0;color: #000000">Welcome to deque</h1>
</th>
</tr>
<tr style="height:170px;">
<td style="border-left:2px solid;border-color:#bbd2df; width:20%; vertical-align:top;">
<ul style="list-style:none; padding:0px; margin:0px;">
<li style="margin-bottom:5px;"><a href="#" style="color:#3d677e;">Home</a></li>
<li style="margin-bottom:5px;"><a href="#" style="color:#3d677e;">About</a></li>
<li style="margin-bottom:5px;"><a href="#" style="color:#3d677e;">Contact</a></li>
</ul>
</td>
<td style="background-color:#f0f0f0; width:80%; vertical-align:top;">
<h2 style="font-size:16px; margin:0px;color: #000000">Welcome to our site</h2>
<p>Here you will learn to create websites...</p>
</td>
</tr>
<tr>
<td colspan="2" style="background-color:#679BB7;">
<p style="text-align:center; margin:5px;color: #000000">copyright © deque.com</p>
</td>
</tr>
</table>]]> |
Scenario 2: Layout table having summary attribute |
Welcome to deque
|
|
|
Welcome to our site
Here you will learn to create websites...
|
|
copyright © deque.com
|
|
<![CDATA[<table cellpadding="10px;" cellspacing="0" style="font:12px verdana, sans-serif; width:100%;" summary="Layout table">
<tr>
<td colspan="2" style="background-color:#679BB7;">
<h1 style="font-size:18px; margin:10px 0;color: #000000">Welcome to deque</h1>
</td>
</tr>
<tr style="height:170px;">
<td style="border-left:2px solid;border-color:#bbd2df; width:20%; vertical-align:top;">
<ul style="list-style:none; padding:0px; margin:0px;">
<li style="margin-bottom:5px;"><a href="#" style="color:#3d677e;">Home</a></li>
<li style="margin-bottom:5px;"><a href="#" style="color:#3d677e;">About</a></li>
<li style="margin-bottom:5px;"><a href="#" style="color:#3d677e;">Contact</a></li>
</ul>
</td>
<td style="background-color:#f0f0f0; width:80%; vertical-align:top;">
<h2 style="font-size:16px; margin:0px;color: #000000">Welcome to our site</h2>
<p>Here you will learn to create websites...</p>
</td>
</tr>
<tr>
<td colspan="2" style="background-color:#679BB7;">
<p style="text-align:center; margin:5px;color: #000000">copyright © deque.com</p>
</td>
</tr>
</table>]]> |
Scenario 3: Layout table having caption attribute |
This is a layout table
Welcome to deque
|
|
|
Welcome to our site
Here you will learn to create websites...
|
|
copyright © deque.com
|
|
<![CDATA[<table cellpadding="10px;" cellspacing="0" style="font:12px verdana, sans-serif; width:100%;">
<caption style="color: #000000"> This is a layout table</caption>
<tr>
<td colspan="2" style="background-color:#679BB7;">
<h1 style="font-size:18px; margin:10px 0;color: #000000">Welcome to deque</h1>
</td>
</tr>
<tr style="height:170px;">
<td style="border-left:2px solid;border-color:#bbd2df; width:20%; vertical-align:top;">
<ul style="list-style:none; padding:0px; margin:0px;">
<li style="margin-bottom:5px;"><a href="#" style="color:#3d677e;">Home</a></li>
<li style="margin-bottom:5px;"><a href="#" style="color:#3d677e;">About</a></li>
<li style="margin-bottom:5px;"><a href="#" style="color:#3d677e;">Contact</a></li>
</ul>
</td>
<td style="background-color:#f0f0f0; width:80%; vertical-align:top;">
<h2 style="font-size:16px; margin:0px;color: #000000">Welcome to our site</h2>
<p>Here you will learn to create websites...</p>
</td>
</tr>
<tr>
<td colspan="2" style="background-color:#679BB7;">
<p style="text-align:center; margin:5px;color: #000000">copyright © deque.com</p>
</td>
</tr>
</table>]]> |