Html Tablo Kodları - Bilişimcilerin Otağı

<table> Tabloya başlarken <table> kodu kullanılarak tablo başlar. Tablo </table> şeklinde kapatılır.

<tr> Tabloda satıra başlarken <tr> kodu kulanılır ve satır sonunda </tr> şeklinde kapatılır.

<table border=”2″> <tr> <td>web</td> </tr> <tr> <td>tasarım</td> </tr> </table>

***<td> den önce <tr> oluşturulmalıdır***

 

<td> Tabloda sütun oluşturulurken <td> kullanılır ve diğer kodlarda olduğu gibi sütun sonunda </td> olarak kapatılır. <table border=”2″> <tr> <td>web</td> <td>tasarım</td> </tr> </table>

<table border> Hücrelerin ve tablonun kenar kalınlığını belirler. Eğer <table border=0> verilirse tablo kenarlığı görünmez.

<table border=”0″> <tr> <td>BİLİŞİM</td> </tr> </table>

<table border=”4″> <tr> <td>BİLİŞİM</td> </tr> </table>

<th> Tabloda başlık <thead> koduyla yazılır. Ancak sütun başlıkları <th> kodula yazılır.

<table border=”2″> <tr> <th>BİLİŞİM</th> <th>TEKNOLOJİLERİ</th> </tr> <tbody> <tr> <td>WEB TASARIMI</td> <td>WEB TASARIMI</td> </tr> <tr> <td>WEB TASARIMI</td> <td>WEB TASARIMI</td> </tr> </tbody> </table>

<width> Tabloda piksel cinsinden genişlik vermeyi sağlar.

<table border=”2″> <tr><td width=50 >WEB</td></tr> <tr><td width=50 >TASARIMI</td></tr> </table>

<table border=”2″> <tr><td width=150 >WEB</td></tr> <tr><td width=150 >TASARIMI</td></tr> </table>

<heigth> Tabloda piksel cinsinden yükseklik vermeyi sağlar.

<table border=”2″> <tr><td height=30>WEB</td></tr> <tr><td height=100>TASARIMI</td></tr> </table>

<colspan> Tabloda satırdaki hücreleri birleştirmeyi sağlar. (Yan yana birleştirir.)

<table border=”2″ > <tr> <td colspan=”2″>BİLİŞİM</td> <tr> <td>WEB</td> <td>TASARIMI</td></tr> </table>

<rowspan> Tabloda sütundaki hücreleri birleştirmeyi sağlar. (Alt alta birleştirir.)

<table border=”2″ > <tr> <td>BİLİŞİM</td> <td rowspan=”2″>TEKNOLOJİLERİ</td></tr> <tr> <td>WEB</td> </table>

<cellspacing> Tabloda hücreler arası boşluğu ayarlar.

<table border=”1″ cellspacing=”2″> <tr><td>BİLİŞİM</td></tr> <tr><td>TEKNOLOJİLERİ</td></tr> </table>

<table border=”1″ cellspacing=”20″> <tr><td>BİLİŞİM</td></tr> <tr><td>TEKNOLOJİLERİ</td></tr> </table>

<cellpadding> Tablo içindeki bilgi ile tablo sınırları arasındaki boşluğu piksel cinsinden ayarlar.

<table border=”1″ cellpadding=”0″> <tr><td>WEB</td></tr> </table>

<table border=”1″ cellpadding=”15″> <tr><td>WEB</td></tr> </table>

<bgcolor> Bgcolor hücre içini renklendirmeyi sağlar. <table border=”2″> <tr> <td bgcolor=”red”>web</td> <td bgcolor=”blue”>tasarım</td> </tr> </table>

<table border=”2″ bgcolor=”red”> <tr> <td>web</td> <td>tasarım</td> </tr> </table>  

<border color> Hücre duvarının rengini değiştirir.

<table border=”4″ bordercolor=”red”> <tr> <td>web</td> <td>tasarım</td> </tr> </table>

<table border=”4″ bordercolor=”blue”> <tr> <td>web</td> <td>tasarım</td> </tr> </table>

 =ÖRNEK= Yazdıklarımı daha iyi anlamanız için aşağıdaki örneği yapmanızı öneririm! <table border=”4″> <tbody> <tr> <td>Yıllara göre</td> <td colspan=”2″><div align=”center”>2005</div></td> <td colspan=”2″><div align=”center”>2006</div></td> </tr> <tr> <td bgcolor=”#00ff00″ height=50><div align=”center”>SAY</div></td> <td width=50><div align=”center”>250</div></td> <td>120</td> <td>100</td> <td>50</td> </tr> <tr> <td><div align=”center”>SÖZ</div></td> <td><div align=”center”>36</div></td> <td rowspan=”2″ bgcolor=”pink”>147</td> <td>180</td> <td rowspan=”2″>85</td> </tr> <tr> <td><div align=”center”>EA</div></td> <td><div align=”center”>125</div></td> <td>160</td> </tr> </tbody> </table>

Yazar: ozan_kutlu

Ozan KUTLU sitemizde 7 yazı eklemiş...

• Tüm yazıları-> ozan_kutlu →
• Kişisel Sayfası

Post Views: 7.703