Forstår meg ikke helt på styling av tabeller

[wan]

Med utg. i nedenstående koder lurer jeg på hvordan jeg får lagt til en "border" under hver <td>, slik at hver linje fremstår som en boks, og er det vanskelig å få annenhver farge, f.eks. hvit/grå?

 

Jeg har forsøkt å forstå dette, men det står helt fast. Håper derfor på rask hjelp.

 

Se bilde for eksempel.

 

HTML:

 

<table summary="Software or other data table" class="sofT" cellspacing="0">
<tr>
<td colspan="4" class="helpHed">Data table template, e.g., software list</td>
</tr>
<tr>
<td class="helpHed">Program</td>
<td class="helpHed">Platform</td>
<td class="helpHed">Version</td>
<td class="helpHed">Support Level</td>
</tr>
<tr>
<td class="sup">Adobe Acrobat</td>
<td>Mac & PC</td>  
<td>5.0 or higher</td> 
<td>2</td> 
</tr> 
<tr> 
<td>Adobe Illustrator</td> 
<td>Mac & PC</td>  
<td>8.0 or higher</td> 
<td>3</td> 
</tr> 
<tr> 
<td>Adobe Imageready</td> 
<td>Mac & PC</td>  
<td>2 or higher</td> 
<td>3</td> 
</tr> 
<tr>
 <td>Adobe Pagemaker</td> 
 <td>Mac & PC</td>  
 <td>6.5</td> 
 <td>3</td>
 </tr> 
<tr> 
<td>Adobe Photoshop</td> 
<td>Mac & PC</td> 
<td>5.5 or higher</td> 
<td>1</td> 
</tr> 
<tr> 
<td>Adobe Reader</td> 
<td>Mac & PC</td> 
<td>5.0 or higher</td> 
<td>2</td>
</tr> 
<tr> 
<td class="sup">Aladdin Stuffit Expander</td>  
<td>Mac</td> 
<td>6.5.1 or higher</td>  
<td>2</td> 
</tr> 

 

 

CSS:

 

table.helpT
{ text-align: center;
font-family: Verdana;
font-weight: normal;
font-size: 11px;
color: #404040;
width: 500px;
background-color: #fafafa;
border: 1px #6699CC solid;
border-collapse: collapse;
border-spacing: 0px; }

td.helpHed
{ border-bottom: 2px solid #6699CC;
border-left: 1px solid #6699CC;
background-color: #BEC8D1;
text-align: left;
text-indent: 5px;
font-family: Verdana;
font-weight: bold;
font-size: 11px;
color: #404040; }

td.helpBod
{ border-bottom: 1px solid #9CF;
border-top: 0px;
border-left: 1px solid #9CF;
border-right: 0px;
text-align: left;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 11px;
color: #404040;
background-color: #fafafa; }

table.sofT
{ text-align: center;
font-family: Verdana;
font-weight: normal;
font-size: 11px;
color: #404040;
width: 580px;
background-color: #fafafa;
border: 1px #6699CC solid;
border-collapse: collapse;
border-spacing: 0px; }

[Runar]

Jeg skjønner ikke helt hva du mener med det første spørsmålet ditt, for hvis bildet du postet er hvordan tabellen ser ut, har to

'ene en ramme.

 

For å få annenhver grå/hvit, kan du gi en egen class til

annenhver , som eksempelet under:

<table>
<tr class="dark">
	<td>Lorem</td>
		<td>Ipsum</td>
</tr>
<tr class="light">
	<td>Dolor</td>
	<td>Sit</td>
</tr>
<tr class="dark">
	<td>Amet</td>
</tr>
</table>

[Moonshine]

http://www.google.no/search?q=styling+tabl...lient=firefox-a

 

1. treff http://www.timrivera.com/tests/csstables.html

2. treff http://veerle.duoh.com/blog/comments/a_css_styled_table/

3. treff http://veerle.duoh.com/blog/comments/a_css...able_version_2/

 

Har du firefox, kunne du f. eks. trykket Ctrl + K og skrevet "styling tables css".

 

Noen ting er forklart alt for mange ganger allerede. Du beskriver ikke noe problem, du sier at du ikke skjønner tegningen. LLL, TTT?