HTML Tablo Oluşturma

HTML tablo oluşturmak için aşağıdaki adımları izleyebilirsiniz:

1. <table> Etiketi: Tabloyu oluşturmak için <table> etiketini kullanın. Bu etiket, tablonun başlangıcını ve bitişini belirtir.
2. <tr> Etiketi: Her satırı temsil etmek için <tr> etiketini kullanın. Bu etiket, tablodaki satırları tanımlar.
3. <th> ve <td> Etiketleri: Tabloda başlık veya hücreler oluşturmak için <th> ve <td> etiketlerini kullanın. <th> etiketi başlık hücresini, <td> etiketi ise normal veri hücrelerini temsil eder.
4. Satır Hücreleri: Her satırda hücreleri tanımlamak için <td> etiketini kullanın. Tablonuzda kaç tane sütun oluşturmak isterseniz, her satırda aynı sayıda hücre tanımlamalısınız.
5. <caption> Etiketi (isteğe bağlı): Tablonuza bir başlık eklemek isterseniz, <caption> etiketini kullanın. Bu etiket, tabloya bir açıklama veya başlık metni eklemenizi sağlar.
6. Tablo Stilleri: CSS kullanarak tabloya stil uygulayabilirsiniz. Özel renkler, arka planlar, kenarlıklar vb. ekleyerek tablonuzu görsel olarak özelleştirebilirsiniz.

Örnek HTML Tablo Kodu

<table>
<tr>
<th>İsim</th>
<th>Soyisim</th>
<th>Yaş</th>
</tr>
<tr>
<td>Ahmet</td>
<td>Yılmaz</td>
<td>25</td>
</tr>
<tr>
<td>Canan</td>
<td>Demir</td>
<td>30</td>
</tr>
</table>

Kaynak

1. “HTML <table> Tag” – W3Schools URL: https://www.w3schools.com/tags/tag_table.asp

The post HTML Tablo Oluşturma appeared first on Haktan Bozer.

Örnek kullanımı aşağıdaki gibidir

Örnek Kod

<table border="1">

<td rowspan="2">satır 2 ve 3 birleşti, sütun 1</td>
<td>satır 2, sütun 2</td>
</tr>
<tr>
<td>satır 3, sütun 2</td>
</tr>

</table>

Örnek Çıktı

The post HTML Tablolarda Sütun Birleştirme appeared first on Haktan Bozer.

Örnek kullanımı aşağıdaki gibidir

Örnek Kod

<table border="1">
<tr>
<td colspan="2">Satır 1 ve 2 birleşti</td>
</tr>

<tr>
<td>diğer satır</td>
<td>ve sütun</td>
</tr>
</table>

Örnek Çıktı

The post HTML Tablolarda Satır Birleştirme appeared first on Haktan Bozer.

Yükseklik Ayarlama

“<width>” sayesinde satırın veya sütunun yüksekliğini ayarlayabilirisniz.

Genişlik Ayarlama

“<height>”  sayesinde satırın veya sütunun genişliğini ayarlayabilirisniz.

Örnek Kod

<table border="1">

<tr>
<td width="90">Bu sütunun yüksekliği 90px dir</td>
<td height="50">Bu sütunun genişliği 50px dir</td>
</tr>

</table>

Örnek Çıktı

The post HTML Tablo Ölçeklendirme appeared first on Haktan Bozer.

“border” etiketi ile tablonun dış çizgi kalınlığını belirtebilirsiniz. “bordercolor” etiketi ile tablonun dış çizgi rengini belirteiblirsiniz. Arka plan rengini “bgcolor” etiketi ile beilirtebilirsiniz.

Bildiğiniz üzere tablolar satır ve sütunlardan oluşmaktadır. Hazırlamak istediğiniz tabloda satır ve sütun oluşturmak zorundasınız.

Satır oluşturmak için

“<tr>” etiketi kullanmanız gerekiyor.

Sütun oluşturmak için

“<td>” etiketi kullanmanız gerekiyor.

Örnek kullanımı ve çıktısı aşağıdaki gibidir

Örnek kod

<table border="1" bordercolor="yellow" bgcolor="blue">
<tr>
<td>Bu tablo</td>
<td>deeneme amaçlı</td>
<td>oluşturulmuştur</td>
</tr>

<tr>
<td>Bu tablo</td>
<td>Üç satır ve</td>
<td>üç sutundan oluşmaktadır.</td>
</tr>

<tr>
<td>Tablonun çizgi rengi sarı</td>
<td>Arka plan rengi ise</td>
<td>mavidir</td>
</tr>

</table>

Çıktısı

The post HTML Tablo Oluşturma appeared first on Haktan Bozer.