58
HTML HTML ETİKETLERİ 20.06.2022 1

sunu (Html-2)

Embed Size (px)

Citation preview

  • 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

  1. 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
    1. Birinci e
    2. ikinci e
      • ikinci enin bir esi
      • ikinci enin baka bir esi
    3. 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