Html Tablo Olusturma
<TABLE>...</TABLE>
Tablolar, sayfalari satirlara/sütunlara bölmek ya da metin veya grafiklerin sayfada istedigimiz yerde olmasini saglamak amaçlariyla kullanabiliriz. Sayfada gözüksün ya da gözükmesin tablolari bir iskelet gibi kullanabilir, böylece su ana kadar ögrendiklerinizle yapamayacaginiz gerçek düzenlemeyi yapabiliriz. Elbette HTML dizayn konusunda bir masaüstü yayincilik programinin gösterdigi hassasiyeti göstermez, bir de browserlarin tablo etiketlerini yorumlamada gösterdigi farkliliklar da buna eklenirse, genel ziyaretçi kesimine hitab etmenin ne kadar zor oldugu anlasilabilir.
Basit bir tablo yapmak için gerekli etiketleri ögrenelim. Öncelikle <TABLE>...</TABLE> etiketlerini yaziyoruz ve arasini doldurmaya basliyoruz. <TR> etiketi ile satirlari <TD> etiketi ile de sütunlari olusturuyoruz. Parametreler:
<TABLE BORDER=".." CELLPADING=".." CELLSPACING=".." ALIGN=".." WIDTH=".." HEIGHT="..">
Border parametresi çerçevenin kalinligini belirtir. border=0 çerçevenin görünmemesini saglar. Cellpadding parametresi hücre içi marj degerini belirtir. cellpadding=0 hücre ile içinde bulunan unsurun (metin/grafik) bitisik olmasini sagliyabilirz.
| HTML etiketi |
Etiketin Web Sayfasindaki görüntüsü |
<table border="1" cellspacing="1">
<tr>
<td>hücre1</td> <td>hücre2</td>
</tr>
<tr>
<td>hücre3</td> <td>hücre4</td>
</tr>
</table> |
| hücre1 |
hücre2 |
| hücre3 |
hücre4 |
|
Align parametresi tabloyu düsey hizalamada kullanilir, align=left sola, align=right saga dayali yapar, align=center ortalar. colspanayni sütundaki hücreleri birlestirmek için de rowspan degiskeni kullanilir. Birlestirilen hücreye ait
<td>. . </td>
etiketi silinir.
| HTML etiketi |
Etiketin Web Sayfasindaki görüntüsü |
<table border="1" cellspacing="1">
<tr>
<td>hücre1</td> <td>hücre2</td><td>hücre3</td>
</tr>
<tr>
<td rowspan="2">hücre4</td> <td colspan="2">hücre5</td></tr>
<tr><td>hücre6</td><td>hücre7</td> </tr>
</table> |
| hücre1 |
hücre2 |
hücre3 |
| hücre4 |
hücre5 |
| hücre6 |
hücre7 |
|
Kategoriler : Html
Webbilgileri.com' da bilgilerinizi paylaşmak istiyorsanız.
Ders Ekle linkmizi kullanabilirsiniz.
2 Adet Yorum Bulunmaktadır.
Yazan : etç
Tarih :24.08.2011 00:39:07
Teşekkürler!
Yazan : kayserili
Tarih :09.07.2012 17:55:58
bence bu kadar ugraşmaya gerk yok dreamweawer biliosanız tablo yapmak daha kolay ama yinde saolun..
Makale hakkındaki yorumlarınız ?