HTML TABLO OLUŞTURMA HALİL İBRAHİM AKGÜN

Ebat: px

Şu sayfadan göstermeyi başlat:

Download "HTML TABLO OLUŞTURMA HALİL İBRAHİM AKGÜN"

Aygül Aylin Karahan
7 yıl önce
İzleme sayısı:

1 HTML TABLO OLUŞTURMA HALİL İBRAHİM AKGÜN

2 HTML Nedir? İşaretleme dili (HyperText Markup Language) Web sayfalarında gösterim işini sağlamak için kullanılan bir işaretleme dilidir. İşaretleme dili, metinlerin nasıl yapılandırılacağına veya biçimlendirileceğine dair açıklamaları içeren yapay bir dildir. Belirteçler (tag lar) kullanılarak yazılır: Tag açılışı <html> Tag kapanışı </html>

3 HTML Nedir? HTML, çok hızlı gelişim ve değişim gösteren bir dil değildir. HTML deki herhangi bir değişiklik, yine birçok platformda değişiklik gerektirmektedir. Bu nedenle HTML, diğer programlarda olduğu gibi kısa sürelerde bir değişime uğramaz.

4 Minimum HTML dokümanı <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>dokümanın Başlığı </title> </head> <body> Dokümanın içeriği... </body> </html>

5 HTML Dosyasının Özellikleri Dosya uzantısı =.htm /.html Komut yazımı <body bgcolor=yellow > Zemin rengi sarı </body> <başlama belirteci (özellik) > Taşıyıcı içeriği </bitiş belirteci>

6 Basit bir HTML sayfası <html> <head> <title>html Öğreniyorum</title> </head> <body> <h1> -- HTML Öğreniyorum -- </h1>... diğer kodlar ve metinler... </body> </html>

7 TABLO <TABLE> belirteçleri içerisinde gösterilir. Tablolar satırlar halinde işlenir. Önce satır oluşturulur. Hücreler oluşturulur Hücrelere bilgiler girilir. Tablo sonlandırılır.

8 Bir satır tanımı yapmak için kullanılır. <TABLE> Birinci Satır

9 <TD> </TD> Genellikle hücrelere bilgi <TD> belirteçleri içerisinde girilir. Bir satırda istenildiği kadar hücre kullanılabilir.

10 2 Satır 6 hücreden oluşan bir tablo <TABLE> <TD> 1.hücre </TD> <TD> 2.hücre </TD> <TD> 3.hücre </TD> <TD> 1.hücre </TD> <TD> 2.hücre </TD> <TD> 3.hücre </TD>

11 Tablo Hizalama ALIGN özelliği kullanılır. CENTER, LEFT ve RIGHT değerleri verilebilir. <CENTER> <TABLE> <TD> 1.hücre </TD> <TD> 2.hücre </TD> <TD> 3.hücre </TD> <TD> 1.hücre </TD> <TD> 2.hücre <TD> <TD> 3.hücre </TD>

12 Hücre Hizalama <TABLE BORDER=1> <TD VALIGN=BOTTOM> İlk hücre </TD> <TD VALIGN=MIDDLE> İkinci hücre </TD> <TD VALIGN=TOP> Üçüncü hücre </TD> <TD VALIGN=TOP> Dördüncü hücre </TD> <TD VALIGN=MIDDLE> 5. hücre </TD> <TD VALIGN=BOTTOM> 6. hücre </TD>

13 Satır ve Sütun Atlamaları <TABLE BORDER=1> <TD COLSPAN=2> örnek </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD>

14 Satır ve Sütun Atlamaları <TABLE BORDER=1> <TD ROWSPAN=2 COLSPAN=2> örnek </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD> <TD> normal </TD>

15 Hücre Renklendirmeleri <TABLE BORDER=2> <TD BGCOLOR=blue> normal </TD> <TD BGCOLOR=cyan> normal </TD> <TD BGCOLOR=green> normal </TD> <TD BGCOLOR=red> normal </TD> <TD BGCOLOR=yellow> normal </TD> <TD BGCOLOR=pink> normal </TD>

16 Alıştırma 1 <TABLE BORDER> <TD>1. veri hücresi</td> <TD>2. veri hücresi</td> <TD>3. veri hücresi</td> <TD>4. veri hücresi</td>

17 Alıştırma 2 <TABLE BORDER> <TD ROWSPAN=2>Bu hücre 2 satır.</td> <TD>Bu hücreler</td><td>diğer</td> <TD>verileri</TD><TD>içeriyor </TD>

18 Alıştırma 4 <TABLE BORDER> <TD>1. veri hücresi</td> <TD COLSPAN=2>Bu hücre 2 sütun.</td> <TD>2. veri hücresi</td> <TD>3. veri hücresi</td> <TD>4. veri hücresi</td>

19 Alıştırma 5 <TABLE BORDER=1> <TH>Netscape</TH> <TH>Internet Explorer</TH> <TH>Mosaic</TH> <TD>X</TD> <TD>X</TD> <TD>-</TD> <TD>X</TD> <TD>-</TD> <TD>X</TD>

20 Alıştırma 6

21 Alıştırma 6 (devam) <TABLE BORDER> <TD><TH ROWSPAN=2></TH> <TH COLSPAN=3>Browser</TH> </TD> <TD><TH>Netscape</TH> <TH>IExplorer</TH> <TH>Mosaic</TH> </TD> <TH ROWSPAN=2>Element</TH > <TH><DFN></TH> <TD>- </TD><TD>X</TD><TD>- </TD> <TH><DIR></TH> <TD>X</TD><TD>X</TD><T D>X</TD>

22 Alıştırma 6 (devam) <TABLE BORDER> <TD><TH ROWSPAN=2></TH> <TH COLSPAN=3>Browser</TH> </TD> <TD><TH>Netscape</TH> <TH>IExplorer</TH> <TH>Mosaic</TH> </TD> <TH ROWSPAN=2>Element</TH > <TH><DFN></TH> <TD>- </TD><TD>X</TD><TD>- </TD> <TH><DIR></TH> <TD>X</TD><TD>X</TD><T D>X</TD>

Benzer belgeler

5. Tablo İşlemleri. Bu bölümü bitirdiğinizde,

5. Tablo İşlemleri. Bu bölümü bitirdiğinizde, 5. Tablo İşlemleri Bu bölümü bitirdiğinizde, Tablonun nasıl oluşturulduğunu, Satır ve hücrelerin ne olduğunu ve nasıl oluşturulduğunu, Tablonun ve hücrelerin nasıl hizalandığını, Satır veya sütunların