CSS Tablo
CSS tablo nitelikleri ile HTML dosyanızdaki tabloları özelleştirebilirsiniz.
Örnekler
Örnek 1
<html>
<head>
<style type="text/css">
table.bir {table-layout: automatic }
table.iki {table-layout: fixed }
</style>
</head>
<body>
<table class="bir" border="1" width="100%">
<tr>
<td width="20%">1000000000000000000000000000</td>
<td width="40%">1000000000</td>
<td width="40%">100</td>
</tr>
</table>
<br />
<table class="iki" border="1" width="100%">
<tr>
<td width="20%">1000000000000000000000000000</td>
<td width="40%">1000000000</td>
<td width="40%">100</td>
</tr>
</table>
</body>
</html>
Örnek 2
<html>
<head>
<style type="text/css">
table.bir {border-collapse:separate;empty-cells:show;}
</style>
</head>
<body>
<table class="bir" border="1">
<tr>
<td>Ahmet</td>
<td>Mehmet</td>
</tr>
<tr>
<td>Necla</td>
<td></td>
</tr>
</table>
</body>
</html>
Örnek 3
<html>
<head>
<style type="text/css">
table.bir {border-collapse:collapse;}
table.iki {border-collapse:separate;}
</style>
</head>
<body>
<table class="bir" border="1">
<tr>
<td>Ahmet</td>
<td>Mehmet</td>
</tr>
<tr>
<td>Necla</td>
<td>Sevda</td>
</tr>
</table>
<br />
<table class="iki" border="1">
<tr>
<td>Ahmet</td>
<td>Mehmet</td>
</tr>
<tr>
<td>Necla</td>
<td>Sevda</td>
</tr>
</table>
</body>
</html>
Örnek 4
<html>
<head>
<style type="text/css">
table.bir {border-collapse:separate;border-spacing:10px;}
table.iki {border-collapse:separate;border-spacing:25px;}
</style>
</head>
<body>
<table class="bir" border="1">
<tr>
<td>Ahmet</td>
<td>Mehmet</td>
</tr>
<tr>
<td>Necla</td>
<td>Sevda</td>
</tr>
</table>
<br />
<table class="iki" border="1">
<tr>
<td>Ahmet</td>
<td>Mehmet</td>
</tr>
<tr>
<td>Necla</td>
<td>Sevda</td>
</tr>
</table>
</body>
</html>
Copyright © 2005 Uzerine.com