HTML KODLARI & WEBMASTER SİTESİNE HOŞGELDİNİZ -_
  Html Dersleri 8
 

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>
Kırmızı hücrem oldu
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>

kenarı kalın oldu
kenarı ince oldu
Hücremin kenarını renkli yapmak istiyorum (bordercolor)
<table border="10" bordercolor="green">
<tr>
<td>kenarını yeşil yaptım</td>
</tr>
</table>

kenarını yeşil yaptım

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>

içi sarı kenarı kırmızı
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>
DayDay
Hücremin içindeki yazı altta olsun (valign=" ")
<table border="1" width="150" height="100">
<tr>
<td valign="bottom">
Hücre</td>
</tr>
</table>
DayDay
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>
1
2
3
4
5
6
7
8
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>
1
2
3
4
5
6
7
8
Yazılarım hücrenin kenarına değmesin (cellpadding)
<table border="1" cellpadding="15">
<tr>
<td>Değmiyor</td>
</tr>
</table>
Değmiyor
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>
Canım sıkılıyor

Bunların hepsini tekrar tekrar deneyip, neler olduğunu görmek, öğrenmenin en iyi yoludur.

 
 
 
ONLİNE İLETİŞİM



HABERLER




TOPLİSTLER

toplistsitene eklefoorex Toplist
Ask Sevgi SohbetWebparki.Net Toplist Site Ekle Hit Al Pagerank3 Link Ekle Link Paylas Toplist, Site Ekle warez toplist Toplist Gündem Toplist TOPlist google-site-verification: googlef7e0d7b695354174.html Siteni Ekle!




 
 
=> Sen de ücretsiz bir internet sitesi kurmak ister misin? O zaman burayı tıkla! <=

© Copyright 2009 Her hakkı saklıdır
mesacet@hotmail.com

mesanet.tr.gg|www.kpss-sinavi.tr.gg|gif-resim.tr.gg|sanalkodlama.tr.gg

Pagerank