Html Komutları - hilmi@trakya.edu.tr
Transkript
Html Komutları - hilmi@trakya.edu.tr
KU- KUR E itimi: Ders Sorumlusu y.Doç.Dr.Hilmi Ku çu Html Komutlar 1. <HEAD> .......... </HEAD> Aras nda Kullan lan Komutlar <TITLE> .......... </TITLE> belirteç çifti: Bu belirteç çifti aras na browser' n (listeleyici) ba k çubu unda görülecek olan sayfan n ba yaz r. <META> belirteci: Bu belirteç ile kullan labilen birçok seçenek vard r. Örne in bir kullan , bu belirteç ile sayfan n içeri ini yans tan baz anahtar kelimeler ve tan mlamalar verilmesidir. Web üzerinde arama yapan arama motorlar sayfalar n meta belirteçlerine bakarak grupland rma yaparlar. Bununla ilgili a daki örnekleri inceleyiniz. <META NAME="Description" CONTENT="HTML ö renmek için yararl bilgiler"> <META NAME="Keywords" CONTENT="html, htm, web sayfas "> <META NAME="Author" CONTENT="Ozge Donmezer"> Ba ka bir kullan m, sayfadaki yaz lar n hangi dil ailesine ait karakterlerle yaz ld belirtmek içindir. Yine a da bunula ilgili bir örnek verilmi tir. <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8858-9"> (Türkçe' nin dahil oldu u dil ailesine ait standard tan mlamas iso-8859-9' dur.) 2. <BODY> .......... </BODY> Aras nda Kullan lan Komutlar Her türlü yaz , formatlama bilgileri bu bölüme girdi inden, bir HTML döküman n esas sm da bu bölüm olu turdu undan, bu bölümde oldukça fazla say da komuttan söz edilecektir. Bu komutlar belirli bir mant k s ras na göre verilecektir. <BODY BGCOLOR=& TEXT=& LINK=& ALINK=& VLINK=&> RRGGBB ile temsil edilen hexadecimal bir say r. (R= Red, G= Green, B= Blue) Bu yöntem kullan larak de ik renkler elde edilebilir. Pek tercih edilmemekle birlikte say yerine do rudan renk isimleri de verilebilir (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow ). Bgcolor seçene i, sayfan n zemininin, text, sayfa içindeki yaz lar n, link, ba lant yaz lar n, alink, aktif durumdaki ba lant yaz lar n, vlink, ziyaret edilmi ba lant lar n renklerini vermemiz için kullan r. Sayfan n zemin rengini tek renk vermek yerine, fona bir background resmi de koyabiliriz. <BODY BACKGROUND=”image_URL” Sayfa kenarlar ayarlamalar da a daki ekilde yap r: <BODY LEFTMARGIN=& TOPMARGIN=&> & marjin miktar temsil etmektedir. Leftmarjin seçene i sol kenar , Topmarjin üst kenar ayarlamam sa lar.Bir döküman içerisindeki yaz lardan istedi imiz k sm n font özelliklerini belirlemek için font belirteci de ik seçeneklerle kullan r: 1 KU- KUR E itimi: Ders Sorumlusu y.Doç.Dr.Hilmi Ku çu <FONT SIZE=&> Font büyüklü ü belirlenecek yaz </FONT> 1’ den 7’ ye kadar de büyüklü ü de artar. ebilir. Say art rd kça, belirteç çifti aras na yazd z yaz n <FONT COLOR=&> Font rengi belirlenecek yaz </FONT> & yerine yine alt basamakl hexadecimal say lar kullanarak ya da do rudan renk ismini vererek, ayarlamam yapar z. <FONT FACE=”&”> Karakter ekli belirlenecek yazi </FONT> & yerine istedigimiz karakter tiplerinden birini yazabiliriz. (Örnegin; Times New Roman, Arial gibi…) Döküman içindeki yaz lardan istedi imiz bir k sm na kal n, italik, alt çizgili vb özellikleri verebiliriz: <B> Kal n yap lacak yaz </B> <I> talik yap lacak yaz </I> <U> Alt çizili yap lacak yaz </U> <SUP> Sat n biraz üst taraf nda görünmesini istedi imiz yaz </SUP> <SUB> Sat n biraz alt taraf nda görünmesini istedi imiz yaz </SUB> <STRIKE> Üstü çizili yap lacak yaz </STRIKE> HTML döküman zda paragraf ba yapmak, sadece alt sat ra geçmek ya da bir k m yaz tek bir sat rda yazmak istedi imiz zaman a daki balirteçleri kullanmal z. <P> …...Yeni bir paragraf yapmak istedi imiz zaman kulland z bu belirteç, çiftiyle birlikte kullan lmaz. Okunabilirli i art rmak için, genelde sat n sonunda kullan r. Bir sat r bo luk b rak r. <BR> …..Bir alt sat ra geçmek için kullan lan bu belirtecin de çifti yoktur. Bu belirteç bir sat r bo luk b rakmadan, bir alt sat ra geçer. <NOBR> Hep ayn sat rda yer almas istedi imiz yaz </NOBR> ….. Bu belirteç, çiftiyle birlikte kullan r ve belirteç çifti aras na yazd z yaz , bir sat rda görüntülenir. Döküman içinde kullanaca ise a da gösterilmi tir: z ba k formatlar ayarlamak için kullanaca z belirteç <H&> Ba k <H&> …..Bu belirteç çifti aras na da kullanaca z ba yazar z. &, 1’ den 6’ ya kadar de ebilen bir say temsil eder. Say büyüdükçe, ba n ebatlar da küçülür. Ba sa a, sola yaslamak ya da sayfan n tam ortas nda bulunmas <H&> belirteci ALIGN seçene iyle kullan r. <H& ALIGN=#> Sa a, sola ya da ortaya yaslayaca 2 z ba k </H> sa lamak için KU- KUR E itimi: Ders Sorumlusu y.Doç.Dr.Hilmi Ku çu & yerine 1’ den 6’ ya kadar bir say , # yerine de left, right ya da center gelmelidir. Bir paragraf oldu u gibi sa a, sola ya da ortaya yaslamak istedimiz zaman da <P> belirtecini çiftiyle beraber benzer ekilde ALIGN seçene i ile kullanmal z. <P ALIGN=#> Sa a, sola ya da ortaya yaslayaca z paragraf </P> # = left, right ya da center Haz rlad z dökümanda kullanmak istedi imiz özel karakter stilleri olabilir.Örne in bir yerden al nt yapmak istedi imizde, al nt yapt z yaz lar n biraz e ik (italik gibi) görünmesini isteyebiliriz. Ya da baz vurgulad z k mlar n daha çok göze çarpmas isteyebiliriz. HTML’ de bu gibi özellikleri sa layan belirteçler de vard r. A da bunlar verilecektir: <EM> Önemli bir yaz </EM> …..Bu belirteç vurguyu belirtmek için kullan r. (D ar ya biraz e ik ç kar.) <STRONG> Çok önemli bir yaz </STRONG> .…Bu belirteç çifti güçlü vurguyu belirtir. (D ar ya biraz koyu ç kar.) <CODE> Yaz lar yaz lar </CODE> …..Bu belirteç çifti yasa, kural belirten yaz lar için kullan r. <SAMP> Örnek </SAMP> …..Örnek ç kt <VAR> De ken, emin de il </VAR> …..De ken, karas z <DFN> Tan mlama </DFN> …..Bu belirteç çifti tan mlama belirten yaz lar için kullan r. (D ar ya hafif e ik ç kar.) <CITE> Al nt </CITE> …..Bu belirteç çifti al nt yaz lar için kullan r. <SMALL> Küçük yaz </SMALL> …..Bu belirteç çifti aras nda yaz lan yaz lar d ar ya çok küçük ç kar. <BIG> Büyük yaz </BIG> …..Bu belirteç çifti aras nda yaz lan yaz lar d ar ya çok büyük kar. <ADDRESS> Yazar n Adresi </ADDRESS> …..Bu format yazar n adresini yazmak içindir. <BLOCKQUOTE> çeriden ba la </BLOCKQUOTE> …..Bu belirteç çifti aras na yaz lan yaz sayfan n hem sa ndan hem solundan içeriye kayar. <DIV ALIGN=LEFT|CENTER|RIGHT> Herhangi bir yaz ya da yaz grubu </DIV> …..Bu belirteç çifti herhangi bir yaz ya da yaz grubunun sa a, sola ya da ortaya yaslanmas sa lar. <CENTER> Ortalanacak yaz </CENTER> …..Bu belirteç çifti yaz ve resimleri sayfada ortalar . <PRE> Formatl metin </PRE> …..Bu belirteçler aras na yaz lan her ey, yaz ld ekrana ç kar. Bo luklar, tab' lar, sat r bölmeleri vb korunur. 3 gibi KU- KUR E itimi: Ders Sorumlusu y.Doç.Dr.Hilmi Ku çu <BLINK> Yan p sönen yaz </BLINK> …..Bu belirteç çifti aras na yaz lan yaz lar d ar kt klar nda bir yan p bir sönen ekilde görünürler. Sayfam zda herhangi bir yere de ik boyutlarda çizgi çizmek isteyebiliriz. Bunu <HR> belirteciyle yapar z. Boyutlar daki gibidir. ayarlad z seçenekleriyle birlikte kullan <HR SIZE=# WIDTH=# ALIGN=#> …..Çizginin uzunlu unu ayarlamak için kulland WIDTH seçene ini WIDTH=50% eklinde de kullanabiliriz. Örne in; bizim kullan sayfan n %50’ si, yani yar uzunlu unda bir çizgi çizmek istedi imizi belirtir. z z Sayfam zdan yapaca z ba lant lara gelince; öncelikle Internet üzerindeki herhangi bir makinadaki bir dökümana ba lant yapmaya bakal m: <A HREF=”URL_adresi”> Buraya t klay z </A> …..Web sayfan zda “Buraya t klay z” yaz ç kacakt r ve bu yaz bir link görünümünü alm r. Üzerine t klad zda yazd z URL adresine ula rs z. URL adresi a daki gibidir. <servis>://<adres>[:port_numaras ]/<dizin>/dosya_ad <servis> yerine webin d nda di er internet servislerini sa layan prottokolleri de yazabilirsiniz. E er, bulundu unuz dizinde bir dökümana ba lant yapmak istiyorsan z, sadece döküman n ad yazman z yeterlidir. Kendi makinan zda fakat ba ka bir dizin alt ndaki bir dökümana ba lant yapmak için, dizin ismini ve döküman ismini yazmal z. <A HREF=”fotograflarimuzgun.gif”> buraya t klay z </A> Ayn döküman n içinde bir yere ba lant yapmak istiyorsak o zaman öyle demeliyiz: <A HREF=”#name”> buraya t klay z </A> Gitmek istedi iniz yerin HTML kodunu ise öyle yazmal z: <A NAME=”name”></A> Buraya ho geldiniz. “name” burada sizin tespit edece iniz herhangi bir isim olabilir. (Örne in 1. Bölüme gitmek istiyorsan z, name yerine 1, ayn ekilde 1. Bölümün bulundu u yere de name olarak 1 yazmal z.) Ba ka bir döküman n bir parças na gitmek istiyorsan z, <A HREF=”URL#name”> hedef </A> yazmal z. Tabii gidece iniz döküman parças n ba nda da <A NAME=”name”></A> yazmal r. HTML döküman Örne in; z içinde bir resim dosyas da ba lant eleman olarak kullanabilirsiniz. Bana mail göndermek için zarf n üzerini t klay n<A HREF=mailto:rovelver21@mynet.com><IMG SCR="envelope.gif"> </A> ……Bu d ar ya öyle ç kar: Bana mail göndermek için zarf n üzerini t klay n ZARF RESMI 4 KU- KUR E itimi: Ders Sorumlusu y.Doç.Dr.Hilmi Ku çu er ba lant yap lacak olan, bir dosyaysa, o dosyan n türü önemlidir. Dosyan n türü, Web sunucusu ve sizin Web istemciniz taraf ndan bilinen bir dosya türüyse (TXT, GIF, JPG, JPEG, PNG, XBM) ba lant yaz n üzerine t klad zda dosya aç r. E er ilgili dosya bilinmeyen bir dosya türüyse, o zaman bu ba lant t kland nda, web istemcisi o dosyay "diske saklamak" ya da bir uygulama program yla açmak eklinde iki seçenek sunar. Baz dosya tipleri ise, web istemcilerine yüklenen yard mc "plug-in" ler ile lenebilir. Bunlardan en popülerleri ses formatlar (AU, WAV, MID); video formatlar (RM, MOV, AVI) ve baz özel tipte dosyalard r (AutoCAD çizim dosyalar gibi). Kayan yaz görüntüsü elde edebilmek için kullan lacak olan belirteç çifti <marquee> ... </marquee> ‘dir. <MARQUEE> Kayan yaz </MARQUEE> …..Bu belirteçler aras ndaki yaz d ar ya kayan ekilde ç kar: Bu belirteç çiftinin beraber kullan ld seçenekler a da verilmi tir: <MARQUEE SCROLLAMOUNT=#> Kayan yaz </MARQUEE> …..# burada kayma h belirten bir say r. <MARQUEE SCROLLDELAY=# SCROLLAMOUNT=#> Kayan yaz </MARQUEE> …..Scrolldelay seçene i yaz n hangi aral klarla bekletilece ini belirten bir say r. Kayan yaz n büyüklü ünü, geni li ini ayarlayabiliriz. Align seçene i ise, top, middle ve bottom de erlerini alabilir. <FONT SIZE=6> <MARQUEE ALIGN=# WIDTH=#> Kayan yaz </MARQUEE> </FONT> Merhaba! Kayan yaz n arkaplan rengini bgcolor seçene i ile a daki gibi verebiliriz. <MARQUEE BGCOLOR=#>Kayan yaz </MARQUEE> <height=# width=#> ANLAMLARINI <hspace=# vspace=#> ANLAYAMADIM… Listeler de incelenmesi gereken önemli bir konudur. Listeleri dört grupta inceleyebiliriz. 1- S ras z (Unordered) Listeler: Bir seçenek belirtilmezse, siyah noktal listeler olu turur. <UL> <LI> Win 98 <LI> Win NT </UL> 5 KU- KUR E itimi: Ders Sorumlusu y.Doç.Dr.Hilmi Ku çu Win 98 Win NT Fakat, siyah nokta yerine, içi bo daire ya da kare ekli ç karmak ta mümkündür. Bunun için kullan lmas gerekli seçenek TYPE seçene idir. TYPE seçene inin alabilece i de erler disc, circle ve square’ dir. 2- S ral (Ordered) Listeler: Bir seçenek belirtilmezse, 1, 2, 3 … numaral listeler olu turur. <OL> <LI> Win 98 <LI> Win NT </OL> Win98 WinNT Burada da type seçene ini kullanarak de ik s ral listeler yaratmak mümkün olur. <LI TYPE= #> # = A, a, I, i, 1 3-Aç klamal Listeler: <DL COMPACT> <DT> Win98 <DD> Bir i letim sistemidir. <DT> WinNT <DD> Arayüzü Windows 95’ e çok benzeyen bir i letim sistemidir. </DL> Win98 Bir i letim sistemidir. WinNT Arayüzü Windows 95’ e çok benzeyen bir i letim sistemidir. 6