HTML Dersleri   Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin Javascript Bedava HTML web sitesi tasarimi dersleri ipuçlarý bedava web alaný bedava yazýlým tasarým test testler öðretmen ogretmen kurs dershane HTML dersleri ile kendi web sitenizi nasýl yapacaðýnýzý öðrenin   Anasayfa www.engin-online.com

 

Bu doküman, Web programcilari için, mosaic, netscape, lynx gibi web

programlarini kullanabildikleri gözönüne alinarak yazilmistir.

Yazinin amaci yeni baslayanlara ve HTML programlama hakkinda az bilgisi olanlara yol göstermektir.

 

Kisaltmalar

WWW

World Wide Web

SGML

Standard Generalized Markup Language

HTML

Hypertext Markup Language

VRML

Virtual Reality Modeling Language

 

HTML dökümanin hazirlanmasi

HTML Dökümanlari tamami ASCII karakterlerden ve
herhangi bir editörde yazilabilen metinlerden olusmustur.
UNIX üzerinde pico veya vi kullanarak HTML dökümanlarinizi
hazirlayabilirsiniz.
Bunun disinda, kullanicinin bu dili bilmedigi farzedilerek
Windows ve DOS altinda çalisan çesitli programlar hazirlanmistir.
Ayrica, HTML kodunun dogrulugunu kontrol eden yardimci
programlara da Internet üzerinden erisilebilir.

Temel bir döküman asagidaki gibi yazilabilir:

 
   < title> Burasi konunun yazilacagi yer </title> 
   < h1> Bu, 1 numarali baslik </h1> 
   HTML dünyasina hosgeldiniz. <br>
   Birinci paragrafimiz. <p>
   Bu da ikinci.. <p> 
       

HTML yazarken, metnin Web programinin anlayacagi sekilde gösterilebilmesi
için belirteçler kullanir. Yukaridaki örnekte:

Tüm HTML belirteçleri, küçüktür isareti (< ), belirteç ismi ve büyüktür
isaretinden (> ) olusur. Genellikle her belirtecin < h1> ve < /h1> örneklerindeki
gibi bir çifti olur ve sondaki belirtecin ismi önüne ayraç gelir.
Yukaridaki örnekte < h1> , Web programina 1 numarali baslik formatinda
yazmasini, </h1> ise bu formati kapatmasini söyler. < p> belirteci istisna bir
durumdur ve < /p> olarak kapatilmaz.

Not1: HTML belirteçleri "case sensitive"dir..? < title > , < tITLE> veya
< tiTlE> belirteçleri ayni görevi yaparlar.

Temel Belirteçler

Konular

Her HTML sayfasinin ve ile ayrilan bir konusu olmak zorundadir. Konular
genellikle sayfadan bagimsiz olarak ekranin en üstüne basilir.

 

  
   <title> Sayfamin konusu </title> 
       

Basliklar

HTML, 1'den 6'ya kadar numaralanmis 6 çesit baslik destekler. Basliklar
normal karakterlerden daha büyük ve kalin yazilirlar. Temel olarak,

 

  
   <Hy> Sayfamin basligi </Hy> 
       

olarak tanimlanmis bir belirteçte y, 1 ile 6 arasi bir deger alabilir. Y sayisi
arttikça fontun büyüklügü azalir.
Pek çok uygulamada, sayfanin konusu ile basligini ayni tutabilirsiniz.

Paragraflar

Diger kelime islemcilerdekinin aksine, HTML dökümanlarinda programci
özel bir belirteç kullanmadikça bir cümle herhangi bir yerinden ayrilip kalan
kismi altta görünebilir, birden fazla bos satir tek satir olarak algilanir.
Asagidaki örnekte, kaynak kodunda iki satir olmasina karsin, WWW
"browser" bunu algilamaz ve ekranda tek satir olarak görüntüler. Bir
"browser" satir sonlarini ve bos satirlari gözardi edeceginden, paragraflari
mutlaka < p> belirteci ile ayirmalisiniz.

 

   HTML'ye hosgeldiniz <br>
   Bu ilk paragraf <p>
       

Buna göre asagidaki örnek, okudugunuz dosyanin basindaki örnekle;
ayni çiktiyi verir.

 

   <title> Burasi konunun yazilacagi yer </title> 
   <h1> Bu, 1 numarali baslik </h1> 
   HTML dünyasina hosgeldiniz. Birinci paragrafimiz. <p> 
   Bu da ikinci.. <p> 

       

HTML dosyalarinin okunurlugunu artirmak için basliklar ile karsilik gelen
belirteçleri ayni satirda, paragraf düzenleyen komutlar ise satir sonunda
olmalidir.

 

Satir sonu belirteci

Paragraf, iki satir arasinda bir satir bosluk birakirken, satir sonu belirteci
kullanildigi kursör alta geçer ve takip eden tüm metin,bosluk birakmadan
bir alttan yazilir.

 

   Bu ilk satir. <br>  
   Ikinci satir daha uzun. <br>
   Ama bu bir paragraf sonu..<p> 
       

 

Sayfanin ortalanmasi

Paragraflar ortalanirken < center> ve </center> belirteçlerinden yararlanilir.
Ortalanmasi istenen tüm metin, bu iki belirtecin arasina yazilir.

 

 
   <center> 
   In practical terms, HTML is a collection of styles.
   </center> 
       

 

Baglantilar

HTML'nin en büyük özelliklerinden birisi, tek sayfa ile sinirli kalmamasidir.
Böylece bir sayfadan digerine baglanti yapilabilir. HTML'in bu görevini
yerine getirmesini saglayan belirteç <a> 'dir Dökümaninizdan baska
dökümana baglanti ypabilmek için:

 

  1. Belirteci girin.
    (Kisaca ilk satira <a yazin)

  2. Hangi dökümana geçis yapmak istiyorsaniz, ismini yazin.
    HREF="dosyaismi"

  3. Bu dökümani ekranda hangi isimle göstermek istediginizi belirtin.

  4. Belirteci kapatin.
    </a>

Kisa bir örnekle açiklayalim:

 
   <a href="internet.html"> Internet nedir? </a> 
       

Ekranda "Internet Nedir?" yazisi belirecek ve kullanicidan burayi seçmeyi
bekleyecektir. Kullanici fare ile bu yazi üzerine tikladiginda ise program
kontrolü yine bir HTML dosya olan internet.html dosyasina birakacaktir.
Bu durumda bulundugunuz dizinden farkli bir dizindeki dosyaya baglanti
yapmak isterseniz, o dosyanin ait oldugu dizini yazmak zorundasiniz.
Buna göre "languages/Fortran/introduction.html" dosyasini kullanabilmek
için

 

   <a href="languages/Fortran/introduction.html" >
   Fortran diline giris </a>
       

seklinde bir belirteç yazmak gerekir.

 

Kaynak Baglantilari

HTML'in bir diger özelligi ise, tek bir makinaya bagimli kalmadan
diger Internet servisleriyle baglanti kurabilmesidir. Bunun için URL
(Uniform Resource Locator) kullanilir. URL, http,gopher, news
olabilecegi gibi telnet de olabilir. Kullanim "sentaksi",

URL-ismi://makina-ismi[:port]/dizinler/dosya-ismi

Burada URL,

file : Kendi sisteminizde bir dosyaya,
http : Bir WWW sunucusu üzerindeki dosyaya,
gopher : Gopher sunucusu üzerindeki dosyaya,
news : Bir UseNet newsgroup'taki dosyaya,
WAIS : WAIS sunucusu üzerindeki dosyaya

erismek için kullanilir.

Port numarasi, genellikle yazilmaz. Size aksi durum belirtilmedikçe
, kullanmaniza gerek yoktur.
Siz de okudugunuz dosyaya ulasmak için,

 

   <a href=http://compclup.ceng.metu.edu.tr/web.lat5.html>
       

yazdiniz.

 

Halihazir döküman bölgeleri baglantilari

Bir metin üzerinde belirli bölgelere ulasmak için yine belirteçler kullanilabilir.
Diyelim ki bir döküman hazirladiniz ve bunu kullanicinin erisebilecegi
2 parçaya ayirmak istiyorsunuz. Yapmaniz gereken, bu üç parçanin
isimlerini belirlemek ve dökümanda yerlerini ayirmaktir. Örnekte,

 

   <a href="bu_dökümanin#1.parça"> Buradan ilk bölüme gidin </a> 
   <a href="bu_dökümanin#2.parça"> Buradan ikinci bölüme </a>
   <a name="1.parça"> Iste ilk bölüm>
   Ilk bölüm ile ilgili metinler burada... </br>
   <a name="2.parça"> Iste ikinci bölüm>
   Ikinci bölüm ile ilgili metiner burada.. </bt>
       

<a href= ile basladiginiz belirteçte önce döküman ismini, sonra da
dökümanin içindeki parça ismini girmelisiniz. <a name= belirtecinde
ise o belirteçten itibaren parçanin basladigini anliyoruz.

Kullanici ilk bölüme gitmek için fareyi kullandiginda ekranda ,

    Ilk bölüm ile ilgili bilgiler burada  

       

ifadesini görecektir.

Diger döküman bölgelerine baglanti

Yukaridaki örnek dogrultusunda farkli olarak tek yapilmasi gereken,
döküman ismine, hangi dökümana baglanti yapmak istiyorsak o ismi vermektir.

 

 
   <a href="diger_döküman_ismi#parça_ismi"> baska dökümana geçis</a>
   <a name=parça_ismi>
       

Ana komutlar

Listeler

Dökümanlarin göze hos görünmelerini saglamak amaciyla listeler
yaygin olarak kullanilir. HTML, pek çok liste çesidi destekler. Bunlar,
düz listeler, numarali listeler, tanimli listeler ve içiçe listelerdir.

 

Düz listeler

Düz liste yaratmak için,

  1. Listeye baslamak için belirteç açilir.
    <ul>

  2. Liste elemanlarini teker teker girerken basina <li> belirteci girilir.
    Kapatmak için </li> belirtecine gerek yoktur.

  3. Listeyi bitirmek için belirteç kapatilir.
    </ul>

Örnek olarak,

 

    <ul> 
    <li> Elma
    <li> Armut 
    </ul> 
       

Örnek, ekranda su sekilde görülür :


<li> belirteçleri içinde paragraflar, diger dökümanlara baglantilar,
ve diger belirteçler kullanabilirsiniz

 

Numarali Listeler

Numarali listeler, düz listelerden farkli olarak, <ul> belirteci yerine <ol> kullanirlar.
Ekranda liste elemanlarinin basinda 1'er artan numaralar görünür.
Asagidaki HTML kodu,

 

    <ol>
    <li> Linux Isletim Sistemi
    <li> Unix Isletim Sistemi
    </ol>
       

ekrana sunlari yazar:

  1. Linux Isletim Sistemi

  2. Unix Isletim Sistemi

 

Tanimli listeler

Genellikle birden fazla basligi olan, her baslik altinda kisa bir metin
içeren yazilar, tanimli listeler ile olusturulur. Tanimi yapilacak baslik,
<dt> ile belirtilir, <dd> ile baslik altina metin girilir. Tüm liste, <dl> ile </dl> arasina alinir.

 

    <DL>
    <DT> NCSA
    <DD> NCSA, the National Center for Supercomputing Applications,
         is located on the campus of the University of Illinois
         at Urbana-Champaign. NCSA is one of the participants in the
         National MetaCenter for Computational Science and Engineering.
    <DT> Cornell Theory Center
    <DD> CTC is located on the campus of Cornell University in Ithaca,
         New York. CTC is another participant in the National MetaCenter
         for Computational Science and Engineering.
    </DL>
       

Ekrandaki çikti su sekilde görünür:

 

NCSA

NCSA, the National Center for Supercomputing Applications, is located on the campus of the University of Illinois at Urbana-Champaign. NCSA is one of the participants in the National MetaCenter for Computational Science and Engineering.

Cornell Theory Center

CTC is located on the campus of Cornell University in Ithaca, New York. CTC is another participant in the National MetaCenter for Computational Science and Engineering.

Içiçe Listeler

Tüm liste çesitleri, 3'den fazla bölüm kullanmadikça içiçe yazilabilir. Örnek olarak,

 

   <ul>
   <li> Istanbul'un büyük semtleri
       <lu> 
       <li> Beyoglu
       <li> Taksim 
       <li> Bakirköy
       </lu>
   <li> Ankara'nin belli basli yerlesim birimleri 
       <lu>
       <li> Kizilay
       <li> Ulus
       </lu>
   </lu>
       

Ekrandaki görüntüsü,


Formatli Metinler

HTML'de, programda yazildigi gibi ekrana çikti vermeyi saglayan komutlar
<pre> ve </pre> belirteç çiftleridir. Bunlar kullanildigi zaman tüm metin, yazildigi
gibi ekranda görünür. Asagidaki satirlar,

 

 
   <pre>
    PATH=.:~/bin/:$PATH
    export PATH
    # Set up the terminal:
           stty erase "^?" kill "^U" intr "^C" eof "^D"
           stty hupcl ixon ixoff
    date '+Tarih :%D'
    TERM=vt100
   </pre>
       

ekranda su sekilde görünür :

    PATH=.:~/bin/:$PATH
    export PATH
    # Set up the terminal:
           stty erase "^?" kill "^U" intr "^C" eof "^D"
           stty hupcl ixon ixoff
    date '+Tarih :%D'
    TERM=vt100
       

HTML'de yorum satirlari

HTML dokumanda yorumlayici tarafindan gözönüne alinmayacak olan yorum
satirlari <!-- ve --> belirteçleri arasina alinir. Bu sayede programi yazmayi
kolaylastiracak yorumlar eklenebilir. Örnegin,

   <!--
   karakterler..
   karakterler...
   -->
       

veya

 

   <!-- karakterler... --
   -- karakterler.. --
   >
       

 

Özel karakterler

Web programi, birtakim karakterleri ekranda göstermek için farkli bir format
kullanir. Asagida, bu tür farkli karakterleri göstermek için girilmesi gereken
kodlar verilmistir.

&lt;

< (küçüktür)

&gt;

> (büyüktür)

&amp;

& (ve)

&quot;

" (tirnak)

Resim Görüntüleme

Eger Web sayfalarini gezerken grafik destekleyen bir program ( Mosaic,
Netscape) kullaniyorsaniz, ekranda resimlerin, arkaplanlarin ve hatta
animasyonlarin oldugunu farketmissinizdir. Bu resimler genellikle X Bitmap
(XBM) , GIF, veya JPG formatli olurlar ve dosyaya görsel bir çekicilik katarlar.
Buna ragmen ayni ekranda çok miktarda resim kullanmaktan sakinmalidir,
çünkü bu durumda resimler kullaniciya daha geç bir sürede ulasir.

Ekranda resim görüntülemek için,

 

   <img src="resmin bulundugu dizin"> 
       

demeniz yeterlidir. Burada, nasil HTML dökümanlarin hepsi .html ile
bitiyorsa, tüm resim dosyalarinin sonu da .xbm , .gif veya .jpg ile
bitmelidir. Özel bir durum olmadikça görüntülenen resmin alt kismi
ile metin yanyana gelirler.

 

   <img src="../images/Mavi.jpg">
   Metin resmin altinda .. 
       

Örnegi, ekranda su sekilde gösterilir:

Metin resmin altinda ..

Sözkonusu metni resmin yanina veya üstüne koymak için ALIGN=TOP
opsiyonunu yerlestirin.

 

   <img src="/artwork/mavi.jpg" align=top>
   Metin resmin üstünde ..
       

Metin resmin üstünde ..

Veya ortaya almak için ALIGN=MIDDLE kullanin.

 

   <img src="/artwork/mavi.jpg" align=bottom>
   Metin resmin yaninda ..
       

Metin resmin yaninda ..

Görüntünün orijinal formatinda degisiklik yapmadan ekranda enini
ve boyunu ayarlamak mümkündür. Bunun için height=sayi ve
width=sayi ara belirteçleri kullanilir. "Sayi" degiskeni piksel olarak verilir.

   <img src="/artwork/mavi.jpg" height=30>
       

 

Tablo Hazirlama

Grafik destekli Web programlarinin tablo destegi ile çok çesitli
istatistiki bilgiler, programlar, her türlü listeler ekranda derli toplu
gösterilebilir. Tablo hazirlama basligi altindaki örnekler, her çesit
tablonun olusturulmasi için yeterli degildir. Kullanici, istegi
dogrultusunda bunlari gerçeklestirmelidir.

Ekranda tablo gösterirken, o an kullanilan pencerenin büyüklügüne
ve tablo içindeki metinin genisligine göre tablonun en ve boyu degisebilir.

Tablo, satir ve sütunlardan olustugu için her hücre ayri ayri tanimlanir.
Her satir ve sütun, kendi içinde baska satir ve sütunlari ihtiva edebilir.

Tablolara baslik, liste, paragraf, form, figür ve her formatta metin konabilir.

Örnegin,

 

   <TABLE BORDER>
   <TR><TH ROWSPAN=2><TH COLSPAN=2>Average
   <TH ROWSPAN=2>other<BR>category<TH>Misc
   <TR><TH>height<TH>weight
   <TR><TH ALIGN=LEFT>males<TD>1.9<TD>0.003
   <TR><TH ALIGN=LEFT ROWSPAN=2>females<TD>1.7<TD>0.002
   </TABLE>
       

Yukaridaki örnek, asagidaki gibi görünür:

 

 

Average

other
category

Misc

height

weight

males

1.9

0.003

females

1.7

0.002

Dikkat edilmesi gereken noktalar:

 

 

Tablo ebadi

Tüm tablonun uzunlugu, en genis satirla belirlenir. Kelimeler
kisaltilmadigi için paragraflar <br> ile kesilmedikçe ekrana
gelirler. En kisa uzunluk da en genis kelime veya resmin
uzunlugu ile bagintilidir.

Align

Tablonun dik halinin nasil olacagini belirler.

Left

Metini ekranin soluna yanasik yazar.

Right

Metini ekranin sagina yanasik yazar.

Colspec

Sütunlarin ebadini ayarlar. Sütunlar soldan saga, bir büyük harf
ve onu izleyen bir sayi ile listelenirler (örnegin
<COLSPEC="L20 C8 L10" > ). Hücrenin ihtiva etttigi yazilari L
harfi sola, R harfi saga alir. C harfi ortalamak için kullanilir.
Burada belirteç opsiyonlari mutlaka büyük harfle yazilir.

Border

Bu belirteç, tablo kenarlarinin ebadini kontrol etmeye yarar.
<table border=10>

Nowrap

Programin tablo içinde paragraflari otomatik olarak kesmemesi
için kullanilir.Böylece kullanici istedigi yerde <br> belirtecini kullanabilir.

 

Tablo Örnekleri

Temel bir 3X2 tablo

A

B

C

D

E

F

<table border>
	<tr>
		<td>A</td> <td>B</td> <td>C</td>
	</tr>
	<tr>
		<td>D</td> <td>E</td> <td>F</td>
	</tr>
</table>


       

"Rowspan" kullanilmasi

1. hücre

2. hücre

3. hücre

4. hücre

5. hücre

<table border>
	<tr>
		<td>1. hücre</td>
		<td rowspan=2>2. hücre</td>
		<td>3. hücre</td>
	</tr>
	<tr>
		<td>4. hücre</td> <td>5. hücre</td>
	</tr>
</table>
       

 

1. hücre

2. hücre

3. hücre

4. hücre

5. hücre

6. hücre

7. hücre

<table border>
	<tr>
		<td rowspan=2>1. hücre</td>
	    	<td>2. hücre</td> <td>3. hücre</td> 
<td>4. hücre</td>
	</tr>
	<tr>
		<td>5. hücre</td> <td>6. hücre</td> <td>7. hücre
   	</td>
	</tr>
</table>


       

"Colspan" kullanilmasi

1. hücre

2. hücre

3. hücre

4. hücre

5. hücre

<table border>
	<tr>
		<td>1. hücre</td>
		<td colspan=2>2. hücre</td>
	</tr>
	<tr>
		<td>3. hücre</td> <td>Item 4</td> <td>5. hücre</td>
	</tr>
</table>


       

"Colspan" ve Basliklarin birlikte kullanilmasi

Head1

Head2

A

B

C

D

E

F

G

H

<table border>
	<tr>
		<th colspan=2>Head1</th>
	    	<th colspan=2>Head2</th>
	</tr>
	<tr>
		<td>A</td> <td>B</td> <td>C</td> <td>D</td> 
	</tr>
	<tr>	
		<td>E</td> <td>F</td> <td>G</td> <td>H</td> 
	</tr>
</table>


       

Yan Basliklarin kullanimi

Baslik1

1. hücre

2. hücre

3. hücre

Baslik2

4. hücre

5. hücre

6. hücre

Baslik3

7. hücre

8. hücre

9. hücre

<table border>
	<tr><th>Baslik1</th>
		<td>1. hücre</td> <td>2. hücre</td> <td>3. hücre</td></tr>
	<tr><th>Baslik2</th>
		<td>4. hücre</td> <td>5. hücre</td> <td>6.hücre</td></tr>
	<tr><th>Baslik3</th>
		<td>7. hücre</td> <td>8. hücre</td> <td>9. hücre</td></tr> </table>

       

"Rowspan" ve yan basliklarin birlikte kullanilmasi

Baslik1

1. hücre

2. hücre

3. hücre

4. hücre

5. hücre

6. hücre

7. hücre

8. hücre

Baslik2

9. hücre

10. hücre

11. hücre

12. hücre

<table border>
	<tr><th rowspan=2>Baslik1</th>
	    <td>1. hücre</td> <td>2. hücre</td><td>3. hücre</td> <td>4. hücre</td>
	</tr>
	<tr><td>5. hücre</td> <td>6. hücre</td><td>7. hücre</td> <td>8. hücre</td>
	</tr>
	<tr><th>Baslik2</th>
	    <td>9. hücre</td> <td>10. hücre</td> <td>11. hücre</td> <td>12. hücre</td>
	</tr>
</table>


       

10 birim kenari olan tablo

1. hücre

2. hücre

3. hücre

4. hücre

<table border=10>
	<tr>	<td>1. hücre</td> <td>2. hücre</td>
	</tr>
	<tr>	<td>3. hücre</td> <td>4. hücre</td> 
	</tr>
</table>


       

Cellpadding ve Cellspacing belirteçlerinin kullanilmasi

A

B

C

D

E

F

<table border cellpadding=10 cellspacing=0>
	<tr>
		<td>A</td> <td>B</td> <td>C</td>
	</tr>
	<tr>
		<td>D</td> <td>E</td> <td>F</td>
	</tr>
</table>
       

A

B

C

D

E

F

<table border cellpadding=0 cellspacing=10>
	<tr>
		<td>A</td> <td>B</td> <td>C</td>
	</tr>
	<tr>
		<td>D</td> <td>E</td> <td>F</td>
	</tr>
</table>
       

A

B

C

D

E

F

<table border cellpadding=10 cellspacing=10>
	<tr>
		<td>A</td> <td>B</td> <td>C</td>
	</tr>
	<tr>
		<td>D</td> <td>E</td> <td>F</td>
	</tr>
</table>


       

Tablo içinde birden fazla satir kullanimi

Ocak

Subat

Mart

Bu 1. Hücre

2. Hücre

Diger hücre,
3. hücre

4. Hücre

ve iste bu
5. hücre

6. hücre

<table border>
	<tr>
		<th>Ocak</th>
		<th>Subat</th>
		<th>Mart</th>
	</tr>
	<tr>
		<td>Bu 1. hücre</td>
	    	<td>2. hücre</td>
	    	<td>Diger hücre,<br>3. hücre</td>
	</tr>
	<tr>
		<td>Cell 4</td>
	    	<td>ve iste bu<br>5. hücre</td>
	    	<td>6. hücre</td>
	</tr>
</table>


       

Hücrenin sagina, soluna ve ortasina metin yazmak

Ocak

Subat

Mart

Hepsi ortada

2. hücre

Diger hücre,
3. hücre

saga yanasik

merkezde

default,
sola yanasik

<table border>
	<tr>
	    <th>Ocak</th>
	    <th>Subat</th>
	    <th>Mart</th>
	</tr>
	<tr align=center>
	    <td>Hepsi ortada</td>
	    <td>2. Hücre</td>
	    <td>Diger hücre,<br>3. hücre</td>
	</tr>
	<tr>
	    <td align=right>saga yanasik</td>
	    <td align=center>merkezde</td>
	    <td>default,<br>sola yanasik</td>
	</tr>
</table>

       

Form Hazirlama

Formlar, kullanicidan bilgi girisi oldugu zaman bunlari okunmaya hazir
duruma getirmeye yarar. Diger bir deyisle, kullanici ile programci
arasinda bir köprü kurar. Programciya mail atmak, WWW üzerinden
arastirma yapmak, belirli bir anahtar sözcügü kullanarak arama
yapmak, ve hatta telefon bilgi bankalarina girmek form kullanarak
halledilir.

Form konusunu anlayabilmek için, HTML programlamayi bilmek ve
en azindan bir programlama diline ( tercihan shell, PERL veya C )
hakim olmak gereklidir.

Form hazirlanirken asagidaki adimlar izlenir :

 

Yukaridaki formu doldurup gönderin. Form, compclup.ceng.metu.edu.tr adresi
üzerinde bir programi çalistiracaktir. Bu program degiskenlerin ismini ve aldiklari
degerleri ekrana basacaktir.

 

Kullanicinin yazdigini okuyabilmek

Bundan sonra kullanicinin forma ne tür bilgiler girdigini bulmak kaldi. Form bilgilerini
okuyabilmek için tercihan perl veya shell bilmek gerekir. Burada örnegi verilecek
cgi-bin progr


Webmaster: www.engin-online.com