added background image.

made one table relatively positioned.
added opacity to transparent scrolled table.
This commit is contained in:
michaelp%netscape.com 1999-03-09 22:12:20 +00:00
parent eedcdf698b
commit 83a0b9f54a

View File

@ -4,7 +4,7 @@
<META NAME="GENERATOR" CONTENT="Mozilla/4.09 [en] (WinNT; U) [Netscape]">
<TITLE>test4</TITLE>
<STYLE>
BODY { font-size: 12pt; }
BODY { font-size: 12pt; background-image: url(bg.jpg); }
</STYLE>
<meta name="crc" content=250397440>
</HEAD>
@ -15,9 +15,9 @@ Example 4: Some simple tables.</H1>
<TABLE BORDER >
<TR>
<TH BACKGROUND="bg.jpg">Color&nbsp;</TH>
<TH BACKGROUND="rock_gra.gif">Color&nbsp;</TH>
<TH BACKGROUND="bg.jpg">Meaning&nbsp;</TH>
<TH BACKGROUND="rock_gra.gif">Meaning&nbsp;</TH>
</TR>
<TR>
@ -113,6 +113,7 @@ layout. This should be long enough.</TD>
</TR>
</TABLE><br>
&nbsp;
<div style="position: relative; top: 190px">
<table cellpadding=2 style="border-collapse:collapse">
<CAPTION ALIGN=BOTTOM>Table 4 has this bottom caption. The table has specified
column widths and collapsing borders.</CAPTION>
@ -148,6 +149,7 @@ column widths and collapsing borders.</CAPTION>
</tr>
</tbody>
</TABLE>
</div>
<BR>
<table>
@ -155,16 +157,32 @@ column widths and collapsing borders.</CAPTION>
<thead>
<tr><td colspan=2 style="font-size: 8pt; font-weight: bold">HEADER
</thead>
<tbody style="overflow: auto; height: 200px; border: 1px solid black">
<tr><td><span style="opacity: 50%; font-size: 16pt; color: red; background-color: cyan">cell-00</span><td>cell-01<td>cell-02<td>cell-03
<tr><td>cell-10<td><span style="opacity: 50%; font-size: 16pt; color: green; background-color: purple">cell-11</span><td>cell-12<td>cell-13
<tr><td>cell-20<td>cell-21<td><span style="opacity: 50%; font-size: 16pt; color: yellow; background-color: blue">cell-22</span><td>cell-23
<tr><td>cell-30<td>cell-31<td>cell-32<td><span style="opacity: 50%; font-size: 16pt; color: purple; background-color: green">cell-33</span>
<tr><td><span style="opacity: 50%; font-size: 16pt; color: red">cell-40</span><td>cell-41<td>cell-42<td>cell-43
<tr><td>cell-50<td><span style="opacity: 50%; font-size: 16pt; color: green">cell-51</span><td>cell-52<td>cell-53
<tr><td>cell-60<td>cell-61<td><span style="opacity: 50%; font-size: 16pt; color: yellow">cell-62</span><td>cell-63
<tr><td>cell-70<td>cell-71<td>cell-72<td><span style="opacity: 50%; font-size: 16pt; color: purple">cell-73</span>
<tr><td><span style="opacity: 50%; font-size: 16pt; color: red; background-color: cyan">cell-80</span><td>cell-81<td>cell-82<td>cell-83
<tr><td>cell-90<td><span style="opacity: 50%; font-size: 16pt; color: green; background-color: purple">cell-91</span><td>cell-92<td>cell-93
<tr><td>cell-a0<td>cell-a1<td><span style="opacity: 50%; font-size: 16pt; color: yellow; background-color: blue">cell-a2</span><td>cell-a3
<tr><td>cell-b0<td>cell-b1<td>cell-b2<td><span style="opacity: 50%; font-size: 16pt; color: purple; background-color: green">cell-b3</span>
<tr><td><span style="opacity: 50%; font-size: 16pt; color: red">cell-c0</span><td>cell-c1<td>cell-c2<td>cell-c3
<tr><td>cell-d0<td><span style="opacity: 50%; font-size: 16pt; color: green">cell-d1</span><td>cell-d2<td>cell-d3
<tr><td>cell-e0<td>cell-e1<td><span style="opacity: 50%; font-size: 16pt; color: yellow">cell-e2</span><td>cell-e3
<tr><td>cell-f0<td>cell-f1<td>cell-f2<td><span style="opacity: 50%; font-size: 16pt; color: purple">cell-f3</span>
</tr>
</tbody>
<tfoot>
<tr><td colspan=2 style="font-size: 8pt; font-weight: bold">FOOTER
</tfoot>
<tbody style="overflow: auto; height: 60px; border: 1px solid black;">
<tr><td>cell-00<td>cell-01
<tr><td>cell-10<td>cell-11
<tr><td>cell-20<td>cell-21
<tr><td>cell-30<td>cell-31
</tr>
</tbody>
<CAPTION ALIGN=BOTTOM>Table 5 has a scrolling tbody.</CAPTION>
</table>
<BR>