|
Tablo
yapmayı öğreniyoruz |
|
Web sayfanızdaki yazı ve resimlerin bulunduğu yeri denetlemek için kullanacağınız
şey tablolardır. Her tabloda dikey ve yatay istediğiniz kadar hücre oluşturabilirsiniz.
Bu hücrelerin büyüklüklerini siz belirleyebilirsiniz. Böylece yazıdığınız yazılar
tam olarak istediğiniz yerde durabilir. Tablo için kullanacağımız temel
etiketler aşağıdakilerdir.
|
| Tablo
oluşturmak için |
| <table>
</table> |
| Yatay
hücre oluşturmak için |
| <tr> |
| Dikey
hücre oluşturmak için |
| <td> |
| 6
bömüme (hücreye) ayrılmış bir tablo yapalım |
| <table border="1"> <tr>
<td>Birinci sırada Hücre1</td>
<td>Birinci
sırada Hücre2</td>
<td>Birinci sırada Hücre3</td>
</tr>
<tr>
<td>İkinci sırada
Hücre1</td>
<td>İkinci sırada Hücre2</td>
<td>İkinci
sırada Hücre3</td>
</tr>
</table> |
| Birinci sırada
Hücre1 | Birinci sırada Hücre2 |
Birinci sırada Hücre3 |
| İkinci sırada Hücre4 |
İkinci sırada Hücre5 |
İkinci sırada Hücre6 | |
| Hücremin
içi renkli olsun (bgcolor) |
<table>
<tr>
<td bgcolor="red">
kırmızı hücrem oldu</td>
</tr>
</table> |
| |
| Hücremin
içinde resim istiyorum (background) |
<table>
<tr>
<td background="deneme.gif">
Heeyy burada kablumbiklerim vaarr</td>
</tr>
</table> |
| Heeyy
burada kablumbiklerim vaarr | |
| Hücremin
kenar kalınlığını değiştirmek istiyorum (border) |
<table
border="10">
<tr>
<td>kenarı kalın oldu</td>
</tr>
</table> |
<table border="1">
<tr>
<td>kenarı ince oldu</td>
</tr>
</table> |
| |
|
| Hücremin
kenarını renkli yapmak istiyorum (bordercolor) |
<table border="10" bordercolor="green">
<tr>
<td>kenarını yeşil yaptım</td>
</tr>
</table> |
|
|
|
Hücremin içini de
renkli yapmak istiyorum (bgcolor) |
<table border="10"
bordercolor="red">
<tr bgcolor="yellow">
<td>kenarını yeşil yaptım</td>
</tr>
</table> |
|
|
| Hücremin
büyüklüğünü ayarlamak istiyorum (width="
" height=" ") |
<table border="10" width="300"
height="80" >
<tr>
<td>genişliği 250 yüksekliği 80 piksel</td>
</tr>
</table> |
| genişliği 300 yüksekliği 80 piksel |
|
| Hücremin
içindeki yazı sağda olsun (align="
") |
<table
border="1" width="150" height= "100">
<tr>
<td align="right">
DayDay</td>
</tr>
</table> |
|
|
| Hücremin
içindeki yazı altta olsun (valign="
") |
<table
border="1" width="150" height="100">
<tr>
<td valign="bottom">
Hücre</td>
</tr>
</table> |
|
|
| Tablomdaki
yanyana iki hücreyi birleştirmek istiyorum (colspan) |
<table border="1">
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
<tr><td colspan="2">4</td><td>5</td>
</tr>
<tr><td>6</td><td>7</td><td>8</td>
</tr>
</table> |
|
|
| Tablomdaki
altalta iki hücreyi birleştirmek istiyorum (rowspan) |
<table border= "1">
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
<tr><td >4</td><td> rowspan="2">5</td><td>6</td>
</tr>
<tr><td>7</td><td>8</td>
</tr>
</table> |
|
|
| Yazılarım
hücrenin kenarına değmesin (cellpadding) |
<table border="1" cellpadding="15">
<tr>
<td>Değmiyor</td>
</tr>
</table> |
|
|
| Hücremin
etrafındaki çerçevenin kalınlığını ayarlıyayım (cellspacing) |
<table border="1" cellspacing="15">
<tr>
<td>Etrafında boşluk var</td>
</tr>
</table> |
| |
|
Bunların hepsini tekrar tekrar deneyip, neler olduğunu görmek, öğrenmenin en
iyi yoludur. |
|
| |
|
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
TOPLİSTLER
