Jump to content

Zmiana wyglądu tabelki przez CSS


eci_kluczbork

Recommended Posts

Witam serdecznie

mam w swoim sklepie tabelki , jest ich bardzo dużo

przykład jak wyglądają: http://www.eci.com.pl/pl/wozki-platformowe/631-wozek-platformowy-250-500-kg-wzmocniona-porecz.html 

 

i teraz jak wygląda kod każdej z nich

Quote

<tbody>
<tr>
<td valign="top">
<p align="center"><strong>Platforma bazowa </strong>wyposażona w koła obrotowe z hamulcem i osłoną.</p>
<table id="table16" style="width: 100%;" border="1">
<tbody>
<tr>
<td align="center"><strong>Symbol</strong></td>
<td colspan="3" align="center"><strong>Wymiary</strong></td>
<td colspan="2" align="center"><strong>Powierzchnia<br />  użytkowa</strong></td>
<td align="center"><strong>Waga</strong></td>
<td align="center"><strong>Udźwig</strong></td>
<td align="center"><strong>Koła</strong></td>
</tr>
<tr>
<td align="center"> </td>
<td colspan="3" align="center">mm</td>
<td colspan="2" align="center">mm</td>
<td align="center">kg</td>
<td align="center">kg</td>
<td align="center">mm</td>
</tr>
<tr>
<td align="center"> </td>
<td align="center"><strong><span style="color: #800000;">a</span></strong></td>
<td align="center"><strong><span style="color: #800000;">b</span></strong></td>
<td align="center"><strong><span style="color: #800000;">c</span></strong></td>
<td align="center"><strong><span style="color: #008000;">d</span></strong></td>
<td align="center"><strong><span style="color: #008000;">e</span></strong></td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"> </td>
</tr>
<tr>
<td align="center" bgcolor="#3366CC"><strong>sw-500.000</strong></td>
<td align="center" bgcolor="#3366CC">910</td>
<td align="center" bgcolor="#3366CC">500</td>
<td align="center" bgcolor="#3366CC">250</td>
<td align="center" bgcolor="#3366CC">910</td>
<td align="center" bgcolor="#3366CC">500</td>
<td align="center" bgcolor="#3366CC">20,5</td>
<td align="center" bgcolor="#3366CC">400</td>
<td align="center" bgcolor="#3366CC">160</td>
</tr>
<tr>
<td align="center"><strong>sw-600.000</strong></td>
<td align="center">1060</td>
<td align="center">600</td>
<td align="center">290</td>
<td align="center">1060</td>
<td align="center">600</td>
<td align="center">25,0</td>
<td align="center">500</td>
<td align="center">200</td>
</tr>
<tr>
<td align="center" bgcolor="#3366CC"><strong>sw-700.000</strong></td>
<td align="center" bgcolor="#3366CC">1060</td>
<td align="center" bgcolor="#3366CC">700</td>
<td align="center" bgcolor="#3366CC">290</td>
<td align="center" bgcolor="#3366CC">1060</td>
<td align="center" bgcolor="#3366CC">700</td>
<td align="center" bgcolor="#3366CC">26,0</td>
<td align="center" bgcolor="#3366CC">500</td>
<td align="center" bgcolor="#3366CC">200</td>
</tr>
<tr>
<td align="center"><strong>sw-800.000</strong></td>
<td align="center">1260</td>
<td align="center">800</td>
<td align="center">290</td>
<td align="center">1260</td>
<td align="center">800</td>
<td align="center">31,0</td>
<td align="center">500</td>
<td align="center">200</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
 

 

Czy mógłby mi ktoś podpowiedzieć jak napisać kod CSS który sprawi że tabelki będą miały obramowanie i linie wewnętrzne, wszystko w kolorze czarnym ?? Z automatu. Setki tabelek dodano dawno temu z frontpage2003 i teraz już nie wyświetlają obramowań lub po aktualizacji danych w tabelach ich nie widać. Z góry dziękuję za pomoc.

Link to comment
Share on other sites

Trochę to zaśmiecone ;) Jak wykorzystasz kaskadowość to pewnie osiągniesz w miarę dobry efekt korzystając choćby z developer.mozilla.org/pl/docs/Learn/CSS/Styling_boxes/Styling_tables czy w3schools.com/css/css_table.asp

Link to comment
Share on other sites

Forum jest do wskazówek i naprowadzania a nie dostosowanych na dany sklep gotowców ;)

Na podanych stronach masz przykładowy kod do umieszczenia w pliku css, np.:

table, th, td {
   border: 1px solid black;
}

albo

table {
  border-collapse: collapse;
  border: 3px solid purple;
}

Przetestuj, doczytaj za co odpowiada i wykorzystaj ;)

Podpowiem, że umiejętne użycie pozwoli takie ustawienia zastosować np. tylko do tabel na konkretnych stronach (np. tylko produktów), wybranych tabel albo tabel umieszczonych w innych tabelach itp. itd. zależnie co tam masz w kodzie poumieszczane.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...