Eger bir dreamweaver kullanıcısıysanız html ile tablo olusturmak için tek tek kod yazmanıza gerek yoktur.Ama Html ögrenmek istiyorsanız html etiketlerinin ne işe yaradıgını bilmenizde fayda vardır.
Html tablolarını olusturarak içine resim , yazı vb şeyler ekleyerek tablonuzu şekillendirebilirsiniz.
Dikkat etmeniz gerek husus , bir web sayfasını sadece html tablolar kullanarak olusturmamanız, Çünki tablolar başka tarayacılarda farklı gözükebilir. Bu da sitenizin statik görünümünü bozar.
tableheaders | tableheaders | tableheaders | tableheaders |
---|---|---|---|
2011 | |||
2012 |
html tablolalarını <table > etiketi ile tanımlarız. tabi table etiketini kapatmayı unutmayın </ table>.
Şimdi tablomuzun anaunsur etiketlerini tanımlayalım ve bu etiketlerle nasıl tablo olusturacagınızı cok basit bir sekilde gormus olucaksanız.
- <tr> etiketi : table row manasına gelir . kaç sıra kullanıcaksınız o kadar tr etıketı kullanmalısınız.Yukarıdan asagı dogru 3 tane tr kullanmıs olduk.
- <th> etiketi : table header anlamına gelir. Tablodada gormus olacagınız gibi tablonuzun başlıkları için kullanabilirsiniz.
- <td> etiketi : table data manasına gelir. Tablo içine girmiş oldugunuz bilgileri gosterır.Tabloda boş gözüken kutucuklar td etiketi içindir.
son olarak tablomuzun html kodlarını eklemek istiyorum ; sizde bu kodları kullanıp veya degıstererek kendınıze daha uygun ve kullanıslı bir hale getirebilirsiniz.
<table align="center" border="3" height="50" style="width: 250px;">
<tbody>
<tr>
<tr>
<th scope="col" width="20">tableheaders</th>
<th scope="col" width="20">tableheaders</th>
<th scope="col" width="20">tableheaders</th>
<th scope="col" width="20">tableheaders</th>
</tr>
<tr>
<tr>
<th height="22" scope="row">2011</th>
<td></td>
<td></td>
<td> </td>
</tr>
</tbody> <tbody>
<tr>
</tbody> <tbody>
<tr>
<th scope="row">2012</th>
<td></td>
<td></td>
<td></td>
</tr>
</tbody></table>
</tbody></table>
- align " center " etiketi ortaya hizalama manasına gelir .
- border tablonun çercevesidir. eger border degeini 0 yaparsak tablonun çercevesi gozukmez.
- height ve width : ise tablonun genişligi ve uzunlugu için kullandıgımız etiketlerdir.
HTML in en basit ama bir o kadarda temel ve önemli bir konusu . mantığını iyi kavramak gerek . teşekkürler .
YanıtlaSilrica ederim
YanıtlaSil