- 1. HTML ETKETLER 6.5.2014 1
2. Paragraf Biimlendirme Etiketleri Bu etiket, ieriinde beyaz
boluk olarak ifade edilen, boluk, sekme (tab) ve satr sonu gibi
karakterlerin korunarak, karakterlerin sabit genilikte
gsterilmesini salar. 6.5.2014 2 3. RNEK Buras PRE etiketi
deneme satrdr. 6.5.2014 3 4. Paragraf Biimlendirme Etiketleri
etiketi html dizgisi ierisinde " Paragraf " anlamna gelir.
zellikle metin girdilerinizi bu etiketle kapsamanz hem biimlendirme
yaparken hem de gsterim esnasnda size byk kolaylklar salar. Bu
etiket belli bir standard temsil ettii iin en sk kullanlan
etiketlerden de bir tanesidir. 6.5.2014 4 5. RNEK
Bu konuda yazlabilecek pek ok konu olduu halde burada brakmak
istiyoruz.
Ancak farkl bir paragraf aarak yazmaya devam edebiliriz.
6.5.2014 5 6. Paragraf Biimlendirme Etiketleri
Satr atlamak iin
etiketi kullanlr. Ancak bu etiketin yeni bir paragraf amadn da
unutmaynz. 6.5.2014 6 rnek:
Bu
bir
ok satrl paragraftr.
Bu Bir ok satrl paragraftr. 7. Paragraf Biimlendirme Etiketleri
Sayfada yatay bir izgi izer. Bu etiketinde
etiketi gibi sonlandrcs yoktur. Yani bu etiket bir yorum aral
belirtmez. Bu etiket ile tanmlanabilecek deiik zellik vardr.
6.5.2014 7 8. RNEK Bu kod, sayfa geniliinde kaln ve mavi bir izgi
izer. 6.5.2014 8 9. Balk Etiketleri Bu etiketler basit olarak bir
balk kullanmak istediimiz zaman, bal yazmak iin kullanlan
etikettir. Etiketin kullanmnda Hx ifadesindeki x 1 ile 6 arasnda
deerler alabilen bir tamsaydr. Bu etiket ile ekrana baslabilecek en
byk boyutlu yaz etiketi ile, en kk boyutlu yaz etiketi ile baslr.
6.5.2014 9 10. Balk Etiketleri Bu etiket ile birlikte bir nceki
etiket olan
etiketindeki gibi drt yer belirleme kodu kullanlabilir. Etiketin
kullanm Bu balk yazs eklindedir. Etiketin yorum aralndaki metin
balk olarak ekrana baslr. 6.5.2014 10 11. RNEK Bu balk yazs Bu balk
yazs Bu balk yazs Bu balk yazs Bu balk yazs Bu balk yazs 6.5.2014
11 12. 6.5.2014 12 13. 6.5.2014 13 Yaz Etiketleri Aklamalar :
Yazlarn boyutu, rengi ,ekli ile ilgili komutlar buraya yazlr. : Yaz
tipini belirtir. : Yaz boyutunu belirtir. : Yaz rengini belirtir.
... : Yaznn kaln olmasn salar. ... : Yaznn
italik(yana yatk) olmasn salar. 14. 6.5.2014 14 Yaz Etiketleri
Aklamalar ... : Yaznn zeri izili olmasn salar. : Yaznn alt izili
olmasn salar. : Yaznn byk olmasn salar. : Yaznn kk olmasn salar.
15. RNEK UYGUALAMALI NTERNET PROGRAMLAMA 6.5.2014 15 16.
Tanmlama Listeleri Terimler ve aklamalarn ieren listeler
oluturmakta kullanlrlar. Bir uygulamann komut satr seeneklerini
listelemek ve altlarnda aklamalarn vermek iin kullanldr. ve
etiketleri etiketinin yorum aral iinde kullanlr. etiketi terim,
etiketi ise aklamas iin kullanlr. 6.5.2014 16 17. RNEK < dl>
align=left Paragraf soya dayal olarak yazar. align=right Paragraf
saa dayal olarak yazar. 6.5.2014 17 18. DER LSTELER
- etiketi kullanlarak oluturulan listeler sral listelerdir.
Sralama saysal, alfabetik ya da romen rakamlar ile yaplabilir.
- etiketi ile oluturulan listelerde ise sralama eleman bir grafik
semboldr.
- etiketi bu etiketlerin yorum aralnda kullanlarak liste eleri
verilir. 6.5.2014 18 19. 6.5.2014 19 20. Sralamasz liste (
- ) tr deerleri: Sralamasz listlerde liste elerini belirtmek iin
3 sembol ismi kullanlr: 1. disc - i dolu bir daire grntler 2.
circle - i bo bir daire grntler 3. square - i dolu ya da bo bir
kare grntler. 6.5.2014 20 21. 6.5.2014 21 22. RNEK
- Birinci e
- ikinci e
- ikinci enin bir esi
- ikinci enin baka bir esi
- nc e
6.5.2014 22 23. ETKET HTML dkmanlarda resimler etiketi ile
belirtilir. etiketi kapaldr, yani bu etiket mutlaka parametreler
ile kullanlr ve bir kapatma etiketi bulundurmaz. Sayfanzda bir
resim grntleyebilmek iin "src" parametresini kullanmak zorundasnz.
Src, "source" (kaynak) anlamna gelir. Buraya grntlemek istediiniz
resim dosyasnn yolunu yazarsnz. 6.5.2014 23 24. RNEK 6.5.2014 24
25. RNEK < img src=atam.jpg width=600 height=500 alt=ATAM>
6.5.2014 25 26. ETKET Bu etiketi bir adres belirterek baka
sitelere, sayfalara ya da ayn sayfann farkl blmlerine ba(link)
vermek veya e-posta adreslerini yazmak iin kullanrz. Web istemciler
genellikle n tanml olarak linkleri alt izili ve mavi olarak
grntler. etiketinin bir yorum aral vardr ve eitli tanmlayc kodlar
da etiket ile birlikte kullanlabilir. 6.5.2014 26 27. ETKET
6.5.2014 27 28. ETKET birinci balant ikinci balant nc balant
6.5.2014 28 29. RNEK < a href= http://www.kediler.com>
6.5.2014 29 30. ETKET Sayfann HEAD alannda kullanlan meta
etiketleri (tag) tarayclara, arama motorlarna, robotlara, link
analiz vb. programlarn hepsine sayfa hakknda ihtiya duyduklar
bilgileri salar. Bu bilgiler, meta etiketinin name zelliinin
ismini, content zelliinin deerini oluturduu isim-deer ifti olarak
salanr 6.5.2014 30 31. ETKET Tamamnn istee bal olarak belirtildii
bu deerlerin popler kullanma sahip olan zellik isimleri aadaki
listede gsterilmektedir. Author: Gncel sayfann yazarnn ve/veya
iletiim bilgilerinin belirtilmesini salar. 6.5.2014 31 32. Abstract
: Gncel sayfann ksa zetinin belirtilmesini salar. Content-language:
Lisan kodlar listesindeki deerlerden birini alarak gncel sayfann
ierik lisann belirtir. rnek, sayfa lisannn Trke olduunun
belirtilmesini gsterir. 6.5.2014 32 33. Content-type: Gncel sayfann
ierik tipini ve karakter setini belirtir. Copyright: Gncel sayfann
aklamasnn belirtilmesini salar. 6.5.2014 33 34. Description: Gncel
sayfann aklamasnn belirtilmesini salar. Designer: Gncel sayfann
(sitenin) tasarmcsnn belirtilmesini salar. 6.5.2014 34 35. ETKET Bu
etiket yorum aral olarak kullanlr. Bu kodun kullanm amac HTML
kodunun iine kullancya grnmeyen aklamalar yerletirmektir. (lk
etapta iimize yaramasa bile tablo ve frame kullanarak hazrlanan
kark HTML dosyalarnda ok yardmc olacaktr.) rnek: 6.5.2014 35 36.
EREVELER Sayfay gezerken, yanda (stte veya baka yerde de olabilir)
bulunan ynlendiricilerin her zaman grlebilmesi iin ereve
kullanabiliriz, bylece kullanc sayfann neresinde olursa olsun
ynlendiricileri grebilir ve ynlendiricilere hemen ulaabilir.
6.5.2014 36 37. EREVELER ereveler ... kodlar arasnda tanmlanr. Eer
yan yana (stunsal) ereveler istiyorsanz, cols="..." parametresini,
eer birbiri aasna (satrsal) ereveler istiyorsanz, rows="..."
parametresini kullanrsnz. 6.5.2014 37 38. 6.5.2014 38 39. RNEK
6.5.2014 39 40. MARQUEE ETKET : Kayan yaz eklemek iin bu etiket
kullanlr. rnek: rnein bilgisayar yazsn kaydrmak iin bilgisayar
deriz. Kayan Yazi- 6.5.2014 40 41. TABLO KULLANIMI Tablolar etiketi
ile belirtilir. Bir tablo etiketi satrlara blnr ve her satr da
etiketi ile stunlara blnr. etiketinin anlam "table data"dr. Bir
veri hcresi (data cell) metinler, resimler, listeler, paragraflar,
formlar, yatay izgiler, tablolar vs. ierebilir. 6.5.2014 41 42.
RNEK satr 1, hcre 1 satr 1, hcre 2 satr 2, hcre 1 satr 2, hcre 2
6.5.2014 42 43. 6.5.2014 43 Etiketi Aklama Tablo Tablo bal Satr
Hcre Manet Hcre gruplar Stun genilii Tablo ba Tablo body zellii
Tablonun en alt ksm 44. RNEK Bilgisayar internet 6.5.2014 44 45.
RNEK Burada bir yaz var Buras da baka yaz kinci satrn ilk stunu
kinci satrn ikinci stunu 6.5.2014 45 Tablomuz iki stunluk olmasna
ramen, burada iki stunluk bir satr var. Buras iki satrlk bir stun.
Buras ilk satr. Buras da ikinci satr. 46. Ekran kts: 6.5.2014 46
47. ETKET Bir form, form elemanlarn iinde bulunduran alandr. Form
elemanlar kullanclarn bilgi girmesini salayan elemanlardr. (metin
alanlar, alabilir listeler, seenek kutular, kontrol kutular)
6.5.2014 47 RNEK: 48. Giri (Input) En ok kullanlan form etiketi
etiketidir. Metin Alanlar Kullancnn rakam veya harf girmesini
istediiniz yerlerde bunu kullabilirsiniz. rnek: Adnz:
Soyadnz: 6.5.2014 48 49. Seenek Butonlar (Radio Buttons) Kullancnn
birok seenek iinden sadece bir tanesini seebilmesini istediiniz
zaman bunu kullanrsnz. rnek: Erkek
Kadn 6.5.2014 49 50. Kontrol kutular (Checkboxes) Kullancnn,
sunulan seenekler iinden istedii kadar semesini salamak iin bunu
kullanabilirsiniz. rnek: Bir bisikletim var:
Bir arabam var:
Bir uam var: 6.5.2014 50 51. Formlarda "Action" Parametresi ve
"Submit" Butonu Kullanc submit (gnder) butonuna tkladnda girilen
bilgiler baka bir sayfaya gnderilir. Action parametresinde ise
bilgilerin hangi dosyaya gnderilecei belirtilir. Bilgilerin
gnderildii dosya, genellikle gelen bilgilerle ilgili ne tr ilem
yaplaca hakknda bilgiler ierir. 6.5.2014 51 52. RNEK Kullanc Ad:
6.5.2014 52 53. Alr Seim Kutusu Seim kutusu eklemenin dier bir yolu
da kodudur. Bunun kullanm aadaki gibidir. rnek: Beyaz Krmz Siyah
6.5.2014 53 54. Image Map IMAGE map'ler kullancnn belirli bir
resmin deiik alanlarna tkladnda farkl adreslere gidebilmesine
olanak tanr. ki ekilde hazrlanabilecek Image Map'ler istee gre HTML
sayfasna veya sunucu zerindeki baka bir dosyaya yerletirilebilir.
Biz bu konumuzda HTML sayfalarna yerletirilen Image Map'leri
inceleyecek Paint Shop Pro yardmyla bir resmin haritasnn nasl
karlacan gstereceiz. 6.5.2014 54 55. RNEK 6.5.2014 55 56. ncelikle
HTML sayfasnda yukardaki gibi kodlar kullanr ve istediimiz resimde
hangi noktalara tklandnda hangi adreslere balanlacan belirtiriz.
Daha sonra gibi bir ifade kullanlarak haritasnn karlmasn istediimiz
resmi sayfaya yerletirir ve bu resim iin ' map1' isimli haritann
kullanlacan belirtiriz. 6.5.2014 56 57. MAP TAG'I AREA taklaryla
tanmlanan haritaya balang yapar ve bir isim verir. AREA COORDS
Tanmlanan ekle gre deiik koordinatlar girebilmenizi salar. 6.5.2014
57 58. SHAPE=tip Tip RECTANGLE, CIRCLE, POLYGON seeneklerinden biri
olabilir. RECTANGLE Bir kare tanmlar ve ' x1, y1, x2, y2' deerleri
kullanlr. CIRCLE Bir ember tanmlar ve ' OrtaX, OrtaY, Yarap'
deerleri kullanlr. POLYGON Bir poligon tanmlar. Birok noktadan
oluabilir. HREF ekle tklandnda hangi adrese gidileceini belirler.
TARGET Gidilecek adresin hangi pencerede alacan belirler. 6.5.2014
58