I already have a css style processed for a table on my web
pages, I need to make 300 pages and have been working on them one
by one. I already have the html codes for all of them; how can I
apply the css style with out having to do them line by line?|||
Use an external style sheet.
–
Walt
“jblade57″ <webforumsuser@macromedia.com> wrote in
message
news:g46quq$8b6$1@forums.macromedia.com…
>I already have a css style processed for a table on my
web pages, I need to
> make 300 pages and have been working on them one by one.
I already have
> the
> html codes for all of them; how can I apply the css
style with out having
> to do
> them line by line?
>
|||
On Sun, 29 Jun 2008 02:10:34 +0000 (UTC), “jblade57″
<webforumsuser@macromedia.com> wrote:
>I already have a css style processed for a table on my
web pages, I need to
>make 300 pages and have been working on them one by one.
I already have the
>html codes for all of them; how can I apply the css style
with out having to do
>them line by line?
looks like you are using tables for tabular data ? – a
legitimate use
of tables even when page layout is done by css-p.
If you keep the html code mean and lean and no spaghetti and
control
all the pages with simple css in an external style sheet.
I have a standard set of code for such uses – which I then
adapt as
necessary.
html code
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0
Transitional//EN”
”
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”
http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html;
charset=iso-8859-1″ />
<title>Untitled Document</title>
<link href=”/tablecss.css” rel=”stylesheet”
type=”text/css” />
</head>
<body>
<table width=”99%” class=”datatable”>
<caption>Caption</caption>
<colgroup>
<col class=”tablecol_1″ width=”10%”/>
<col class=”tablecol_2″ width=”15%”/>
<col class=”tablecol_3″ width=”25%”/>
<col class=”tablecol_4″ width=”50%”/>
</colgroup>
<thead>
<tr>
<th>Header column 1</th>
<th>Header C2</th>
<th>header C3</th>
<th>Header C4</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Footer column 1</td>
<td>Footer Column 2</td>
<td>Footer Column 3</td>
<td>Footer Column3</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>R1-C1</td>
<td>R1-C2</td>
<td>R1-C2</td>
<td>R1-C4</td>
</tr>
<tr>
<td>R2-C1</td>
<td>R2-C2</td>
<td>R2-C2</td>
<td>R2-C4</td>
</tr>
<tr class=”odd”><!– In the table layer model, Row
is above column
–>
<td>R3-C1</td>
<td>R3-C2</td>
<td>R3-C2</td>
<td>R3-C4</td>
</tr>
<tr>
<td>R4-C1</td>
<td>R4-C2</td>
<td>R4-C2</td>
<td>R4-C4</td>
</tr>
<tr>
<td>R5-C1</td>
<td>R5-C2</td>
<td>R5-C2</td>
<td>R5-C4</td>
</tr>
<tr>
<td>R6-C1</td>
<td>R6-C2</td>
<td>R6-C2</td>
<td>R6-C4</td>
</tr>
</tbody>
</table>
</body>
</html>
controlled by this is the exteral style sheet
/* CSS Document */
body {margin:0; border:0; }
.datatable{
border-collapse: collapse;
margin: 2px;
border: 1px solid #CC0000;
font-size: 1em; }
.datatable td {
border: 1px solid #CC0000;
padding: 0.1em 0.5em;
margin: 1px;
}
.datatable th {
border: 1px solid #CC0000;
padding: 0.1em 0.5em;
margin: 1px;
}
.datatable thead { background-color:silver; }
.datatable tfoot {background-color:black; color:white;}
.datatable caption {
background-color:gray;
caption-side:top;
color:white;
font-size:1.1em;
font-weight:bold;
margin: 0.01em 0 0.15em 0;
padding: 0.5em 1em;
}
.datatable td {font-size:90%;}
.odd { background-color:white; } /* use with datatable to
alternate
row colour */
.even { background-color:#fffded; }
.tablecol_1 {background-color:red; }
.tablecol_2 {background-color:green; }
.tablecol_3 {background-color:yellow;}
.tablecol_4 {background-color:blue;}
–
~Malcolm~*…
~*
Related posts:
- CSS Tables
- table with border in some cells and not others?
- table with border in some cells and not others?
- Positioning of <div> tags in tables
- Tables inside Divs
Related posts brought to you by Yet Another Related Posts Plugin.
