HTML Ders Notları

HTML Ders Notlar
izlere bu notlarla web sayfas yap m hakk nda k sa bir fikir vermeye e l!aca# m. ncelikli olarak bir
web sayfas n n yani uzant s n HTML (Hyper Text Markup Language)olan bir sayfan n al !ma mant # na
gz atal m.HTML dilinde yaz lm ! kodlar servis sa#lay c s n n sunucusuna(Server) yklersiniz (Upload).
Bu sunucuda yay nlanan web sayfam z sitemize gelen ziyaretilerin browserlar taraf ndan kodlar yorumlan r ve
bylece ziyareti bizim sayfam z grm! olur.
HTML diliyle baz i!lemleri yapabilece#imiz gibi baz lar n ise yapamay z.mesela metin biimlendirme, liste,
ba#lant lar, resim kullanma, tablolar, ereveler ve forumlar yapabilirken etkile!imli ve olaylara duyarl sayfalar,
formlar i!leyip de#erlendiren sayfalar yapamay z.
Bir web sayfas yapmak iin tek gereken onu nas l tasarlayaca# m z bilmektir.E#er bu i!i kod kullanmadan
yapacaksan z Frontpage, Dreamweaver vs programlar kullanabilirsiniz.Ama ben bu i!i kodlarla yapaca# m diyorsan z
size tek gereken herhangi bir metin editr(Metin editr olarak Windows ta NOTEPADi kullanbilirsiniz) .7imdi
gelelim temel kodlar tan maya:
<html></html>
Bu kod browsera HTML belgesinin ba!lad # ve biti#i yeri

bildirir.Btn di#er kodlar bu iki kod aras na yaz l r
<head></head> HTML belgesinin ilk blmdr.Bu blme yaz lanlar metin
olarak ekranda gzkmez.
<title></title>
Head blm iine yaz lan Title kodu sayfan n ba!l # n n
yaz ld # blmdr.
<body></body> HTML belgesinin btn ieri#i bu kodlar aras na yaz l r.
Bu temel kodlar grdkten sonra isterseniz bir HTML sayfas n n genel yap s na gz atal m.
<html>
<head>
<title><title>
</head>
<body>
</body>
</html>
Bu temel yap y kavrad ktan sonra basit bir sayfa yapabiliriz.
<html>
<head>
<title>Deneme Sayfas </title>
</head>
<body>
Bu bir deneme sayfas d r
</body>
</html>
Yukar da grd#n kodlar metin editrne yaz p deneme.html ad yla kaydedersek ve bu deneme.html
dosyas n al !t r rsak ekrana a!a# daki gibi Bu bir deneme sayfas d r yaz l bir sayfa gelecektir.
-1-
MET N B MLEND RME ET KETLER :
HTML sayfas n n temel unsurlar n #rendikten sonra,art k i!in inceliklerine inebiliriz.?lk olarak yazd # m z
metinleri !ekillendirmeye bakal m.A!a# daki tabloda yer alan etiketleri bilmemiz bu konuda bize ok kolayl k
sa#layacakt r.
<h1></h1>
Ba l k
<h2></h2>
Ba l k
<h3></h3>
Ba l k
<h4></h4>
Ba l k
<h5></h5>
Ba!l k
<h6></h6>
Ba l k
<b></b>
Yaz lar koyu yapar
<i></i>
Yaz lar n z italik karakter yapar
<u></u>
Yaz lar n za alt izgi koyar
<p></p>
Paragraf etiketi yapar. Paragraf n z n alt na ve stne bo!luk koyar.
<br>
Sat rba! yapar.
7imdi yukar da #rendiklerimizi bir rnek ile uygulayal m.

<html>
<head>
<title>Metin Biimlendirme</title>
</head>
<body>
HTML size metin biimlendirme konusunda geni! olanaklar sa#lar.Metinleri ister <h1>kocaman</h1> ister
<h6>kck</h6> isterseniz <b>koyu</b>, <i>italik </i> veya <u>altyaz l </u> yazabilirsiniz.Yada sat rba! yapabilir
<br> veya <p> paragraf olu!turabilirsiniz </p>
<\body>
<\html>
FONT TAGI:
Metin biimlendirmek iin yukar da grd#mz etiketler d ! nda biraz sonra grece#imiz <font></font>
etiketi de kullan l r.
Font etiketi sahip oldu#u parametreler sayesinde metinlerin renk,yaz tipi,boyut gibi zelliklerini de#i!tirmenize
yard mc olur.?sterseniz bu etikette gemeden nce renklerden k saca bahsetmek yerinde olur. HTMLde renkler
hexdecimal formunda ifade edilir Bir renk 16'l k say dzeninde 6 rakamdan olu!ur ve Bu dzende 9'dan sonraki
say1 ar gstermek iin 'A'dan 'F'ye kadar olan harfler kullan l r. Bununla birlikte HTML baz renklerin ?ngilizce
isimlerini anlar; a!a# daki rnekte bu renkleri grmektesiniz.
-2-
Green=Ye!il
Black=Siyah
Blue=Mavi
Red=K rm z
Yellow=Sar
Orange=Turuncu
Burada grlen renkler hexdecimal cinsinden de ifade edilebilir: rne#in #FFFFFF beyaz ,#000000 siyah.
Renkleri k saca tan d ktan sonra art k as l konumuza geebiliriz.HTML belgesinin body blmne yazd # m z
metni <font></font> etiketleri aras na alarak bu metne etiketin a!a# da da listelenen parametreleri do#rultusunda baz
zellikler kazand rabiliriz
Color
hexdecimal veya rengin ?ngilizce ismi de#erini al r
Face
Yaz trnn ismi de#erini al r
Size
1 ile 7 aras nda istenilen de#eri al r
7imdi bu parametreleri bir rnekte kullanal m:
<html>
<head>
<title>Font kullan m </title>
</head>
<body>
Font etiketinin color parametresini kullanarak <font color="#FF0000">renkli</font>
<font color="Blue">yaz1 lar</font>
<font color="#00FF00">yazabilir</font>;<p>
de#i!ik yaz karakterleri kullanabilirsiniz:
<font face="Verdana">Mesela yle!</font><p>
Hatta yaz lar n z
<font size="+6"> bytp</font>
<font size="-1"> Kltebilirsiniz</font>
</body>
</html>
A!a# daki ekran grntsnde de yukar daki rne#in nas l al !t # n grebilirsiniz.
ARKA PLAN ve BODY ET KET :

Web sayfas n n ieri#e yaz yazmay #rendikten sonra isterseniz web sayfalar m z n arka planlar n
renklendirmeye geelim. HTML belgesinin ekranda grntlenen blm olan body blmnn ba!lad # n browser'a
<body> etiketiyle bildirdi#imizi biliyoruz. Bir etiketin herhangi bir parametresine atad # m z de#er, o etiketin
olu!turdu#u alan ierisinde geerlidir.Yani gibi <body> etiketinin parametrelerine verilen de#erler, btn sayfa iin
geerlidir.A!a# da bu parametreleri ve kullan l !lar n gryorsunuz.
bgcolor
Sayfan z n arka plan n n rengini belirler
Arka plana .gif,.jpg gibi HTML'in yorumlayabildi#i bir resim
background
dosyas koyman z sa#lar
text
Sayfan zdaki metinlerin rengini belirler
<body bgcolor=blue> Sayfam z n arka plan n mavi yapar.
<body background=c:\belgelerim\resim.jpg> Sayfam z n arka plan na resim.jpg isimli dosyan n ieri#i ta! r.
RES MLER ve IMG ET KET :

Bir web sayfas nda do#ru ve yerinde kullan ld klar nda sayfaya estetik a s ndan ok !eyler katarlar. fakat
byk boyutlar nedeniyle yava! yklenirler.Bu da ziyaretinin s k lmas na,hatta sayfay terk etmesine neden olabilir.Bu
-3-
nedenle, en az ndan Internet ba#lant lar daha h zl oluncaya kadar, resimleri 'az ve z' kullanman z do#ru
olacakt r.Resimler <img> etiketi arac l # yla kullan l rlar.A!a# da bu etiketin parametrelerini gryorsunuz.
src
Resmin bulundu#u dizini bu parametre ile
bildiririz
width
Resmin geni!li#ini piksel cinsinden bildirir
height
Ayn !ekilde resmin yksekli#ini bildirir
border
Resmin etraf ndaki izginin kal nl # n
belirtir.
align
Yatay konum
belirler;left,right,center
de#erlerini al r.
alt
Mouse resmin zerindeyken yazaca# n z
meni gsterir
<img src="deneme.gif" border="6" align="left alt=left>
BA#LANTILAR:
Web sayfalar m z n ieriksel k sm n bitirdi#imize gre !imdi web sayfalar nda en ok kullan lan unsurlardan
biri ba#lant lara (Hyperlink)geebiliriz.Ba#lant lar ziyaretinin bir t klama ile, sitenizin iinde veya d ! nda,
belirledi#iniz herhangi bir adrese gitmesini sa#lar.Ba#lant lar browser'a <a> etiketi ile bildirilir.
href
target
Ba#lant n n adresi bu parametreyle bildirilir

Sayfan n a laca# yeri belirler.Target parametresi,a lacak sayfa yeni bir
sayfa olarak a lacaksa'_blank',ayn pencere iinde a lacaksa '_self',ayn
pencerere ierisinde stten itibaren a lacaksa '_top' de#erini al r.
<a href=http://www.sayfaadi.com target=blank> Sayfa Ad </a>
Sayfam zda yukar daki sayfa grntsnde oldu#u gibi Sayfa Ad ad nda www.sayfaadi.com Internet sitesine ba#l
bir yaz yazar.Bu ba#lant ya t klad # m zda Sayfaadi.com sitesi yeni bir pencerede a l r.
Ba#lant lar konusuna girmeden sayfam za nas l resim ekleyece#imizi grm!tk.7imdi bu resimleri nas l bir
ba#lant haline getirebiliriz bunu grelim.A!a# daki rne#i yazd # n zda, zerine t klan nca istedi#iniz bir adrese yeni
pencere aan bir resim elde edersiniz.
<a href=http://www.sayfaadi.com target="blank"> <img src="deneme.gif" ></a>
TABLOLAR:
Metinleri listelerin yan s ra tablolar yard m yla da dzenleyebiliriz. Srf yaparken rastlad # n z
sayfalar o#unlukla i ie gemi! tablolardan olu!ur. Bu nedenle iyi bir sayfa tasarlamak iin tablolara hakim
olmak gereklidir.
Tablolar <table>...</table> etiketleri aras na yaz l r.<tr> etiketi bir yatay s ra
olu!turulur, bu yatay s ra istenilen say da <td> etiketiyle hcrelere blnr.A!a# daki rne#e bakarak tablo
mant # n anlayabilirsiniz
< table> Hcre1
Hcre2
Hcre3
<table border="1">
<tr>
<td >Hcre1</td>
<td >Hcre2</td>
-4-
Hcre4
Hcre5
Hcre6
<td >Hcre3</td>
</tr>
<tr>
<td>Hcre4</td>
<td>Hcre5</td>
<td>Hcre6</td>
</tr>
</table>
<TD< td>
bgcolor
background
border
bordercolor
bordercolorlight
bordercolordark
align
cellspacing
cellpadding
Hcrenin iinin rengini belirler.

Hcre iine resim koyar.
Hcre etraf na yerle!tirece#iniz
erevenin kal nl # n belirler
ereve rengini belirler
erevenin sol ve st kenarlar n n
rengini belirler
erevenin sa# ve alt kenarlar n n
rengini belirler.
Hcrenin yatay konumu belirler
Hcre etraf ndaki erevenin
kal nl # n belirler.
Hcre iindeki elemanlar n (metin,
resim, vs.) ereveden uzakl # n
belirler.
<html>
<head>
<title>Bu bir table denemesidir</title>
</head>
<body>
<table width=250 height=250 bgcolor=#ffffff border=2 bordercolor=5 bordercolrlight=aqua
bordercolordark=blue align=left cellapacing=2 cellpadding=2>
<tr>
<td align=center>hcre</td>
</tr>
</table>
</body>
</html>
EREVELER (FRAME):
ereve tekni#i, bir web sayfas n istenilen miktarda paraya blp, bu sayfa zerinde birka sayfa birden
grntlenmesine olanak verir. Bu tekni#in en ok kullan lan varyasyonu, sayfan n sol veya st k sm ndan kk bir
alan blmek (yani sayfay ikiye blmek), bu kk alana men bilgilerini, di#er byk alana ise sayfan n as l ieri#ini
yerle!tirmektir.
-5-
Fakat !unu da belirtmekte fayda var, birok tasar mc estetik a s ndan erevelere pek s cak bakmaz; genelde
st ste tablolar kullanmay tercih eder. Yine de pek s k kullan lmayan bu tekni#i akl n z n bir yerinde tutun, belki
faydal olabilir.
ereve tekni#inde, ilk nce parent(ana) frame denilen bir sayfa olu!turmak gerekir. <Frameset>... </frameset>
etiketlerinin parametreleri olan cols ve rows ifadeleri ile sayfay dikey ve yatay olarak ne oranda blmek istedi#imizi
browser'a bildiririz. Src parametresi ile ana erevenin blmlerinde grntlenecek sayfalar n adreslerini bildirdikten
sonra, geriye biraz nce adreslerini bildirdi#imiz sayfalar uygun bir !ekilde haz rlamak kal r. 7imdi bu kar ! k ifadeyi
a!a# daki rnekle daha iyi anlayal m, sonra da <frameset> etiketini inceleyelim.
<html><head>
<title>ereverne#i</title>
</head>
<frameset cols="150,*">
<frame name="menu" src="menu.html">
<frame name="esas" src="esas.html">
</frameset>
<noframes>
<body>
<h1>Browser' n z n srm sayfam z grntlemeye uygun degil, ltfen daha yeni bir srm
ykleyip tekrar deneyin!</h1>
</body>
</noframes>
</html>
Burada yapt # m z !ey ana sayfay soldan 150 piksel geni!li#inde blp iki sayfa elde etmekten ibaret. Ayr ca browser'a
soldan ilk blme (150 px olan blm) 'menu.html', ikinci blme ise 'esas.html' sayfalar n yerle!tirmesini bildirdik.
Burada dikkat edilmesi gereken nokta <frameset> etiketinin </head> ile <body> etiketleri aras na yerle!tirilmesidir.
<Noframes>...</noframes> etiketleri iinde yer alan blm ise ereveden anlamayan eski srm browser'lar iindir.
7imdi a!a# daki kodlardan ilkini 'menu.html', ikincisini ise 'esas.html' ad yla ana pencereyi kaydetti#iniz dizine
kaydedin.
Menu.html
<html>
<head>
<title>menu</title>
</head>
<body bgcolor="teal">
</body>
</html>
Esas.html
<html>
<head>
<title>esas</title>
</head>
<body bgcolor="Red"></body>
</body>
</html>
Son olarak tekrar ana sayfay at # n zda (ismi nemli de#il, yeter ki di#er iki sayfa ile ayn dizinde bulunsun!) sonu
a!a# daki gibi olacakt r:
-6-
A!a# da <frameset> etiketinin parametrelerini gryorsunuz :
Rows
Safay enine blmenizi sa#lar
Cols
Sayfay boyuna blmenizi sa#lar
<frameset rows="150,*">
</frameset>
</frameset>
cols ve rows parametreleri piksel de#eri alabilecekleri gibi '%' cinsinden de de#er alabilirler, rne#in:
<frameset cols="%20,%80">
Daha nce kulland # m z '*' ifadesi ile blnecek alan n geni!li#ini browser'a b rakabiliriz:
<frameset cols="%20,*">
Son olarak sayfay e veya daha fazlaya da b!ebiliriz:
<frameset rows="150,200,100,*"> ifadesi ile ana pencereyi drde bleriz.
frameborder
Ana sayfan n blmleri aras nda s n r izgisi olup

olmamas s n belirler.('yes', 'no'; veya '1', '0'
de#erlerini al r)
Border
ereveler aras ndaki s n r n kal nl # n piksel

cinsinden belirler.
<frameset cols="150,*" frameborder="1">

</frameset>
<frameset cols="150,*" border="10">
</frameset>
7imdi de <frame>; etiketinin parametreleri:

Src
Bunu zaten biliyorsunuz, ereve iinde grntlenecek sayfan n yeri
marginwidth
Sayfan n solundaki kenar bo!lu#unu belirtir
marginheight
Sayfan n stndeki kenar bo!lu#unu belirtir
Noresize
'1' veya '0' de#erlerini al r, '1' verilirse pencere boyutlar sabitlenir.
Scrolling
'yes', 'no', 'auto' de#erlerini al r, kayd rma ubuklar n n durumunu belirler.
erevelerle al !maya ba!lamadan nce bilmeniz gereken nemli bir nokta:

Hat rlarsan z ba#lant lar konusunda <a> etiketinin target isimli bir parametresi oldu#undan ve bu
parametrenin 'erevead ' de#erini alabilece#inden bahsetmi!tik. Bu parametre bize ba#lant n n belirtti#i
adresdeki sayfan n ad n verdi#imiz ereve iinde a lmas n sa#lar.?sterseniz bunu bir rnekte grelim.
Bu sayfay index.htm ad yla kaydedin
Bu sayfay menu.htm ad yla kaydedin
-7-
<html><head>
<title>ereverne#i</title>
</head>
<frame name="menu" src="menu.htm">
<frame name="ana" src="esas.html">
</frameset>
<noframes>
<body>
<h1>Browser' n z n srm sayfam z grntlemeye
uygun degil, ltfen daha yeni bir srm
ykleyip tekrar deneyin!</h1>
</body>
</noframes>
</html>
<html>
<head>
<title>menu</title>
</head>
<body bgcolor="teal">
Ltfen rne#i grmek istiyorsan z <a href=link.htm
target=ana>t klay n</a>
</body>
</html>
Bu sayfay esas.htm ad yla kaydedin

<html>
<head>
<title>ana</title>
</head>
<body bgcolor="Red"></body>
</body>
</html>
Bu sayfay da link.htm ad yla kaydedin

<html>
<head>
<title>menu</title>
</head>
<body bgcolor="yellow">
<h1>Bu sayfaya menu.htm sayfas ndaki linke t klayarak
k rm z sayfam z n(ana erevesinde) yerine bu sayfa
a lm !t r.</h1>
</body>
</html>
Yukar daki rne#in ekran k ts a!a# daki gibi olacakt r.

Ye!il Sayfadaki Linke T klad ktan Sonra
Ye!il Sayfadaki Linke T klamadan nce
FORMLAR:
Formlar bize HTML kullanarak sayfan z ziyaret edenlerle temas kurman z sa#larlar. Formlar yoluyla
ziyaretilerin herhangi bir konuda gr!lerini alabiliriz; veya haz rlayaca# m z bir formla ziyaretilerden ki!isel
bilgilerini isteyebiliriz. Formlar <form>...</form> etiketleri aras na yaz l rlar. Bu etiketin parametrelerini #renmeden
nce form trlerine bir gz atal m.
FORM TRLER :
-8-
A!a# da form trlerini ve kullan l !lar n gryoruz.:
text
maxlength: Yaz labilecek maksimum

text uzunlu#u
value: varsay lan de#er
size: Px cinsinden alan n uzunlu#u
<form>
<input type="text" maxlength="10"
size="12" value="?sminiz?"
</form>
<input type="text">
Ziyaretinin ismi, telefonu gibi k sa bilgilerini almak iin kullan l r.
password
Tm parametrleri text ile ayn d r.
<form>
Ltfen !ifre girin:<br>
<input type="password"
maxlength="10" size="12">
</form>
<input type="password">
7ifre almak iin kullan l r, yaz lan karakterler ekranda '*' !eklinde grntlenir
textaraea
rows : Alan n karakter cinsinden

yksekli#i
cols : Alan n geni!li#i
<form>
<textarea cols="12" rows="4">Buras
bir textarea!</textarea>
</form>
<textarea >...</textarea>
Text kutusuna s #mayacak uzun bilgileri, mesela ziyaretinin sayfa ile ilgili d!ncelerini almak iin kullan l r.
<form>
<input type="checkbox"
checked: sayfa a ld # nda 'checked'
checkbox
checked>seenek 1
ibaresi bulunan kutu i!aretli olur.
<input type="checkbox">seenek 2
</form>
<input type="checkbox>
Ziyaretiye, verilen seeneklerden birini, birka n veya hepsini seme imkan verir.
<form>
<input type="radio"
name=sec">seenek1<br>
checked: sayfa a ld # nda 'checked'
<input type="radio" name=
Radio
ibaresi bulunan daire seilmi! olur.
"sec"checked>seenek2<br>
<input type="radio"
name="sec">seenek2
</form>
<input type="radio">
Ziyaretiye, verilen seeneklerden sadece birini seme imkan verir.
size: Select etiketinin karakter
<form>
cinsinden boyutu
<select size= "1">
selected: Grevi checked ifadesinin
<option selected>seenek1
select
ayn d r.
<option>seenek2
multiple: Ziyaretinin birden ok
<option>seenek3
seim yapmas na olanak verir
</select>
<select><option>...<option>...</select>
Ziyaretiye seeneklerden birini veya (multiple ifadesi ile) birka n seme imkan verir.
<form>
value: Butonun zerine yaz lacak
<input type="submit"
submit
metin buraya yaz l r
value="Gnder">
</form>
<input type="submit>
Ziyareti doldurdu#u formu bu d#meye basarak gnderir
<form>
reset
value: Butonun zerindeki metin
<input type="reset" value="Sil">
</form>
<input type="reset" >
Ziyaretinin doldurdu#u formda, ziyaretinin yazd # her !eyi siler.
button
value: Butonun zerindeki metin
<form>
-9-
<input type="button"
value="D#me">
</form>
<input type="button>
D#melere JavaScript ile baz i!levler kazand r labilir.
<FORM> ET KET :
?!te <form> etiketinin parametreleri ve bunlar n i!levleri:
method
'Get' veya 'post' de#erlerini alabilir. Method parametresinin de#eri formu gnderece#iniz CGI
program a s ndan nemlidir. E#er CGI kodlar yazmay bilmiyorsan z, birok servis
sa#lay c size form'lar n z n sonular n e-mail'inize gnderme imkan verir. E#er byle bir
hizmetten yararlanacaksan z 'post' metodunu semelisiniz.
<form method= "post>

Formu gnderece#iniz CGI program n n adresini action parametresiyle bildirirsiniz. E#er
yukar da bahsedilen hizmetten yararlanmak istiyorsan z, servis sa#lay c n zdan bu program n
adresini #renmelisiniz. rne#in bu adres 'freeservers' iin '/cgi-bin/cgiemail' 'dir.
<form method="post" action= "/cgi-bin/cgiemail">
action
Yukar daki kodlar kullanarak bir rnek yapal m.

<html>
<head><title>asd</title></head>
<body>
<form method="post" action="aa.asp">
<h3>HTML dersini nas l buldunuz</h3>
<br>Ad n z <input type="text" maxlength="12" size="12" value"=Ad n z">
<br>7ifre <input type="password" maxlength="6" size="6">
<br>Cinsiyetiniz
<input type="checkbox" checked>Erkek
<input type="checkbox">Kad n
<br>Seiminiz
<br> <input type="radio" name="oy" checked>Mkembel
<br> <input type="radio" name="oy">?yi
<br> <input type="radio" name="oy">Fena De#il
<br> <input type="radio" name="oy">Berbat
<br> <input type="radio" name="oy">Fikrim Yok
<br>Gr!leriniz
<br> <textarea rows="10" cols="30">Ltfen fikrinizi girin</textarea>
<br>Ltfen blmnz sein
<br> <select size="1">
<option selected>Bilgisayar Mh
<option>Elektronik Mh
<option>Deri Mh
<option>Di#er
</option></select>
<br><input type="submit" value="Kaydet"> <input type="reset" value="Temizle">
</form>
</body>
</html>
Yukar daki rne#in ekran kt s a!a# daki gibi olur.
- 10 -
Evet arkada!lar HTML dersimizin tm konular bu kadar. Bu derste #rendiklerinizle sizlerde kendinize
istedi#iniz gibi bir web sayfas yapabilirsiniz.Ama !unu unutmay n ki tek ba! na HTML sizi ancak pasif sayfalar
yapabilirsiniz. Daha aktif daha olaylara duyarl sayfalar yapmak istiyorsan z di#er web tasarlama dillerinden en az bir
tanesini daha #renmezin gerekecektir.Bunlar n en ba! nda ise JavaScriptler gelmektedir. Gnmz Trkiyesine
bakt # m z zaman birok firma web tasarlamak konusunda sadece HTML bilgisine de#il ASP veya PHP bilgilerinin de
olup olmad # na bakmaktad r. E#er bir web tasar mc s olmak istiyorsan z yukar da bahsedilen dillerden en az birini
daha bilmeniz sizin aleyhinize olacakt r. Sizlere bu konuda ba!ar lar dilerim.
- 11 -

HTML Ders Notları

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

HTML Ders Notları

Uploaded by

Copyright:

Available Formats

HTML Ders Notlar

Bu kod browsera HTML belgesinin ba!lad # ve biti#i yeri

MET N B MLEND RME ET KETLER :

7imdi yukar da #rendiklerimizi bir rnek ile uygulayal m.

ARKA PLAN ve BODY ET KET :

RES MLER ve IMG ET KET :

Ba#lant n n adresi bu parametreyle bildirilir

<a href=http://www.sayfaadi.com target=blank> Sayfa Ad </a>

Hcrenin iinin rengini belirler.

A!a# da <frameset> etiketinin parametrelerini gryorsunuz :

Safay enine blmenizi sa#lar

Sayfay boyuna blmenizi sa#lar

Ana sayfan n blmleri aras nda s n r izgisi olup

ereveler aras ndaki s n r n kal nl # n piksel

<frameset cols="150,*" frameborder="1">

7imdi de <frame>; etiketinin parametreleri:

Bunu zaten biliyorsunuz, ereve iinde grntlenecek sayfan n yeri

Sayfan n solundaki kenar bo!lu#unu belirtir

Sayfan n stndeki kenar bo!lu#unu belirtir

'1' veya '0' de#erlerini al r, '1' verilirse pencere boyutlar sabitlenir.

'yes', 'no', 'auto' de#erlerini al r, kayd rma ubuklar n n durumunu belirler.

erevelerle al !maya ba!lamadan nce bilmeniz gereken nemli bir nokta:

Bu sayfay index.htm ad yla kaydedin

Bu sayfay menu.htm ad yla kaydedin

Bu sayfay esas.htm ad yla kaydedin

Bu sayfay da link.htm ad yla kaydedin

Yukar daki rne#in ekran k ts a!a# daki gibi olacakt r.

Ye!il Sayfadaki Linke T klamadan nce

A!a# da form trlerini ve kullan l !lar n gryoruz.:

maxlength: Yaz labilecek maksimum

Tm parametrleri text ile ayn d r.

rows : Alan n karakter cinsinden

<form method= "post>

Yukar daki kodlar kullanarak bir rnek yapal m.

You might also like