HTML Metin Düzeni

ibiramcan · 27.03.08, 22:48

Paragraf Oluşturma

Hatırlıyorsanız paragraf yapmak için veya <pre> kodlarını kullanıyorduk. Oysa HTML'de sırf paragraf yapmakla görevlendirilmiş bir kod var: ... arasına yazacağımız ifadeler paragraf halinde gösterilir. Hemen bir uygulama geliştirelim

codeDivStart()Kod:

<html>
<head>
<title>Kum Tanesi</title>
</head>
<body>
Sokaklarda bulurum kendimi

yalnızlığımdan her kaçışımda. Cebimde ne sigara

ne de para..."Kum tanesi" olduğumu bilirim ama

gösteremem kendimi bir türlü dev haritalarda... Atlarım bir arabaya; "sür!" derim "Kızılay'a"...Eski bir sevgili gelir nedense aklıma; "Dön" derim "Ulus’a"... Barda çalışır

adı"Ayça". Tahmin ettiğim gibi

işte burada... Heyy gülüm hey

şu anda kokteyl yapmakta; Biz duygularımızdan yapardık kokteyli

sonra da sarhoş olurduk

sevişirdik aldırmadan

güneş ışıklarının vücudumuzu olduğu gibi gösteren aydınlığına... "Geri döneceğimi biliyormuş gibi "baktı suratıma

dudaklarında kendince haklı bir tebessüm

haklı çıktı ya davasında... Dedim"ilan ı aşk yapmaya gelmedim; Param yok

sigaram yok

dışarıda taksi bekliyor

üstelik evin anahtarını kaybettim

üstelik kalacak yerim yok..." Ayça sever ya bizi

halletti bütün işleri... Üstelik eski günlerdeki gibi sevişti...
Neyse kafiyeyi bozmayalım...Sonraki gece

aynı dert

aynı tasa... Rakı

radyoda çalan bir nihavend şarkı ve geçmişte yaşanmış ya da yaşanamamış bir kaç ağlatan anı

birleşirler odamda... Eski bir sevgili gelir nedense aklıma... Atlarım arabaya; "Sür!" derim "Mithatpaşa’ya"... Lojmanlarda oturur

edebiyat hocası

adı "Selda"... Tahmin ettiğim gibi işte burada. Vayy gülüm vay

geceliğiyle çıktı kapıya; En sevdiğim elbisesiydi bu

aklımı alırdı her defasında... Bu kızlar hep böylemi hoca;Bu da "geleceğimi biliyormuş gibi" baktı suratıma. Üstelik aynı tebessüm... Benim derdimse aynı; "Geçiyordum

uğradım". Güzel "afyan" u varmış

"fayfe" yaptık

içtik

içtik... Sonra da bulduk kendimizi yorgun bir sevişme sonrasında... Sanki yıllardır birlikteymişiz gibi rahattık...
Kafiye gene bozuldu galiba

neyse; Sonra atarım kendimi evime

odama. Yalnızlığım

"tahmin ettiğim gibi" burada... Ah gülüm ahh

en çok o bakar zaten suratıma

"geri döneciğimi biliyormuşcasına". Tebessüm etmez

soğuktur

zaten bir tek o koyar bana. Yalnızlığın "çöl" olduğunu anlarım

ben zaten "kum tanesi"... Sonra atlarım bir arabaya

"Sür!" derim "Gaziosmanpaşa’ya"; ******lik yapar

adı "Asuman"... Kafiye son isimde bozuldu ama; Boşveer bütün isimler "aynıdır" aslında...
</body>
</html>

Dikkat ederseniz yazdığınız paragraflar sola yaslanmış haldedir.

Paragraf Hizalama

Peki paragrafları nasıl sağa yaslarız veya ortalarız? Bunun için kodunun bazı parametreleri vardır. Mesela paragrafı sağa yaslamak için kodu şöyle kullanırız:... Ortalamak için: .... Sola yaslamak için: .... Hiçbir parametre kullanmazsak

paragraf sola yaslanmış halde çıkacaktır. Aşağıdaki uygulamaya bakalım:

codeDivStart()Kod:

<html>
<head>
<title>Kum Tanesi</title>
</head>
<body>
Sokaklarda bulurum kendimi

yalnızlığımdan her kaçışımda. Cebimde ne sigara

ne de para..."Kum tanesi" olduğumu bilirim ama

gösteremem kendimi bir türlü dev haritalarda... Atlarım bir arabaya; "sür!" derim "Kızılay'a"...Eski bir sevgili gelir nedense aklıma; "Dön" derim "Ulus’a"... Barda çalışır

adı"Ayça". Tahmin ettiğim gibi

işte burada... Heyy gülüm hey

şu anda kokteyl yapmakta; Biz duygularımızdan yapardık kokteyli

sonra da sarhoş olurduk

sevişirdik aldırmadan

güneş ışıklarının vücudumuzu olduğu gibi gösteren aydınlığına... "Geri döneceğimi biliyormuş gibi "baktı suratıma

dudaklarında kendince haklı bir tebessüm

haklı çıktı ya davasında... Dedim"ilan ı aşk yapmaya gelmedim; Param yok

sigaram yok

dışarıda taksi bekliyor

üstelik evin anahtarını kaybettim

üstelik kalacak yerim yok..." Ayça sever ya bizi

halletti bütün işleri... Üstelik eski günlerdeki gibi sevişti...
Neyse kafiyeyi bozmayalım...Sonraki gece

aynı dert

aynı tasa... Rakı

radyoda çalan bir nihavend şarkı ve geçmişte yaşanmış ya da yaşanamamış bir kaç ağlatan anı

birleşirler odamda... Eski bir sevgili gelir nedense aklıma... Atlarım arabaya; "Sür!" derim "Mithatpaşa’ya"... Lojmanlarda oturur

edebiyat hocası

adı "Selda"... Tahmin ettiğim gibi işte burada. Vayy gülüm vay

geceliğiyle çıktı kapıya; En sevdiğim elbisesiydi bu

aklımı alırdı her defasında... Bu kızlar hep böylemi hoca;Bu da "geleceğimi biliyormuş gibi" baktı suratıma. Üstelik aynı tebessüm... Benim derdimse aynı; "Geçiyordum

uğradım". Güzel "afyan" u varmış

"fayfe" yaptık

içtik

içtik... Sonra da bulduk kendimizi yorgun bir sevişme sonrasında... Sanki yıllardır birlikteymişiz gibi rahattık...
Kafiye gene bozuldu galiba

neyse; Sonra atarım kendimi evime

odama. Yalnızlığım

"tahmin ettiğim gibi" burada... Ah gülüm ahh

en çok o bakar zaten suratıma

"geri döneciğimi biliyormuşcasına". Tebessüm etmez

soğuktur

zaten bir tek o koyar bana. Yalnızlığın "çöl" olduğunu anlarım

ben zaten "kum tanesi"... Sonra atlarım bir arabaya

"Sür!" derim "Gaziosmanpaşa’ya"; ******lik yapar

adı "Asuman"... Kafiye son isimde bozuldu ama; Boşveer bütün isimler "aynıdır" aslında...
</body>
</html>

Şimdi uzun örneğimizin ilk paragrafı sola yaslanmış

ikinci paragrafı sağa yaslanmış

üçüncü paragraf ise ortalanmış haldedir. Paragrafı yazı editörlerinde yapıldığı gibi iki yana yaslamak da mümkün

ancak bunu ileri ki bölümlerde göreceğiz... kodunu web sayfalarını tasarlarken çok sık kullanacağımızı göreceksiniz.

Tanıtıcı Mesaj Parametresi

Size kodunun bir başka parametresini de vereyim: "title". ... arasına yazılan bir paragrafın üzerine fareyi getirdiğimizde

yazdığımız mesajla karşılaşırız. Örnekle görelim:

codeDivStart()Kod:

<html>
<head>
<title>Paragraf Örneği</title>
</head>
<body>
Kırlangıç yapar yuvayı; çamur sıvayı sıvayı
Duvarın dibinde resmim aldılar; ak kağıt üstünde tanıyın beni
</body>
</html>

u örnek de paragraflara hem align hem de title parametrelerini uyguladık. Bu tür parametrelerin birçok kod için geçerli olduğunu ileride göreceğiz. Yaptığımız son uygulamada

ilk paragrafın üzerine farenin imlecini bir-iki saniyeliğine (size on saniye gibi gelecek) bıraktığımızda

"Bu ananonim bir dize." mesajını göreceğiz. Bu da HTML sayfalarının bir başka özelliği.

Karakter Kodları

HTML kodu yazarken

bıraktığımız birden fazla boşlukların dikkate alınmadığı ve tek boşluk gibi gösterildiğini önceki sayfada söylemiştik. Birden fazla boşluğun görülebilmesi için

metin editörünün formatını doğrudan web sayfalarına taşıyan <pre> kodunu kullanıyorduk. Oysa bu yolu izlemek zorunda değiliz;   kodu bir boşluk karakterine karşılık gelir. Mesela paragraf başı yapmak istiyoruz. Bunun için paragrafın başına 5 boşluk karakteri koymak istiyoruz diyelim. N'apacağız?

codeDivStart()Kod:

<html>
<head>
<title>Kentsel Mimari</title>
</head>
<body>
     Balıkların hafızası üç saniyedir. Üç saniye sonra

üç saniye önceki yaşamlarından koparlar. Böylece üç saniyede ancak katettikleri akvaryumu

bir okyanusmuşcasına gezerler yaşamları boyunca. Yaşam onlara her üç saniyede yeni bir şey getirir

monotonluk onlar için 3 saniyeyi aşamayacak bir kavram.
</body>
</html>

Bu uygulamayla gördük ki HTML'in görmediği bazı karakterleri yazdırabilmek için kodlara (işlevsel olarak ASCII kodlarına benzer) ihtiyacımız vardır. Örneğin ben bu web sayfasında size HTML kodlarını anlatırken

bu kodlardan yararlanıyorum. Yoksa HTML'de "<HTML>" kelimesini normal yazarak gösteremeyiz. Çünkü web sayfası oluşturulurken

HTML derleyicisi "<HTML>" kelimesini metinsel bir ifade olarak değil

bir HTML kodu olarak algılar. Böyle olmaması için "<" karakteri yerine <

">" karakteri yerine de > kodlarını kullanırız. Bunu bir uygulamayla gösterelim:

codeDivStart()Kod:

<html>
<head>
<title>HTML Kodları</title>
</head>
<body>
<html> kodu HTML uygulamalarının başlangıç kodudur. 
<title> kodu web sayfasının başlığını yazmak için kullanılır. 
 kodu ile web sayfalarında paragraflar oluşturabiliriz. 
<pre> kodu ile metin editörlerinin formatını web sayfalarına taşırız. 
 kodu ile metnin bir satır aşağıya atlamasını sağlarız. 
 kodu ile metinsel ifadelerin koyu (bold) olmasını sağlarız. 
</body>
</html>

Biraz akıl karıştırıcı değil mi? Sayfada nelerin çıkması gerektiğini

kodu yazarken gözünüzde canlandırabiliyorsanız

bu işi kapmışsınız demektir. Bu tip karakter kodlarını kullanırken

yaptığınız işi denetlemeyi unutmayın. HTML'in sizi uyaracağını falan düşünmeyin bile. HTML hataları görmezden gelir ve bünyesinde taşır. (XHTML derslerinde bu konuya ayrıntılı şekilde değineceğim.) Tabi bu karakter kodlarını ezberleyim falan demeyin; yine de   kodunun aklınızda kalması yararlıdır.

Yazı Komutları

Karakter kodları

parametreler falan

filan. Bu konuların biraz can sıkıcı olduğunu biliyorum. Bilgisayar dillerine pek alışkın olmayan kişiler

bir dilin tüm komutlarını

parametrelerini öğrenmeden kendilerini güven içinde hissetmezler. Oysa bu bilgisayar fobisi aşılamadan yazılımcı olunamaz. Önemli olan algoritma yapısını ve dilin kendine has ritmini yakalayabilmek. (Bu sözleri edebiyat parçalamak için değil

olayın felsefesini anlatabilmek için yazıyorum.) HTML'in çok az kodunu öğrenmeniz bile yeterli olabilir; kaldı ki kod bakımından HTML çok da zengin sayılmaz. Hiç kimse tüm komutları

tüm fonksiyonları

tüm parametreleri aklında tutmaz. Zaten dil

tıpkı yaşayan bir organizma gibi bir değişim

bir evrim sürecindedir. Bazı kodlar eskimiş

körelmiş

kullanılırlığı kalmamıştır. HTML'de böyle bir çok kod var. Bunları bilseniz de olur

bilmeseniz de. Önemli olan yapacağınız uygulamayı zihninizde modelleyebilmek

yoksa ne kadar komut bildiğinizin; o komutları verimli bir şekilde kullanamadıkça

pek önemi yok. Şimdi pek kullanılmayan ama literatürde rastlayabileceğiniz bu tür bazı komutları yazıyorum. Bunları aklınızda tutmaya çalışmayın

sadece göz aşinâlığınız bulunsun. Kullanmanız gerektiğinde "böyle şeyler vardı

açıp bakayım" dersiniz.

<address></address> Arasına yazılan metinsel ifadeyi

adres formatına çevirir. (nasıl birşey olduğunu merak edenler denesin; çok kullanılan bir şey değil)
<bdo dir="rtl"></bdo> Arasına yazılan metinsel ifadeyi tersine çevirir. "Banu"'yu "unaB" yapar. Bu kod olmasaydı

insanoğlu n'apardı bilemiyorum.
<sample></sample> Arasına yazılan metni "sample" (örneklem) moduna çevirir. (Matah birşey zannetmeyin

merak eden denesin.)
<code></code> Arasına yazılan metni "code" (kod) moduna çevirir. Bilgisayar kodlarını web sayfasına yazacaksanız

tavsiye ederim.
<kbd></kbd> Arasına yazılan metni "keyboard" (klavye/daktilo) moduna çevirir.
<tt></tt> Arasına yazılan metni "teletip metin" moduna çevirir.
<var></var> Arasına yazılan metni "variable" (var) moduna çevirir. (not: değişken tanımlama gibi birşey zannetmeyin

yukarıdakiler gibi gereksiz birşey.)
<acronym></acronym> Arasına yazılan metni kısaltma moduna çevirir.
<abbr></abbr> Arasına yazılan metni yine kısaltma moduna çevirir.
<q></q> Arasına yazılan metni "quotation" (alıntı) moduna çevirir. (Pek faydalı birşey değil.)

Bunların hepsini kapsayan bir örnek yapalım.

codeDivStart()Kod:

<html>
<head>
<title>Çok Faydalı HTML Kodları</title>
</head>
<body>
<address>: <address>Göztepe'ye 3. ligde başarılar dileriz.</address> 
<bdo dir="rtl">: <bdo dir="rtl">Göztepe'ye 3. ligde başarılar dileriz.</bdo> 
<sample>: <sample>Göztepe'ye 3. ligde başarılar dileriz.</sample> 
<code>: <code>Göztepe'ye 3. ligde başarılar dileriz.</code> 
<kbd>: <kbd>Göztepe'ye 3. ligde başarılar dileriz.</kbd> 
<tt>: <tt>Göztepe'ye 3. ligde başarılar dileriz.</tt> 
<var>: <var>Göztepe'ye 3. ligde başarılar dileriz.</var> 
<acronym>: <acronym>Göztepe'ye 3. ligde başarılar dileriz.</acronym> 
<abbr>: <abbr>Göztepe'ye 3. ligde başarılar dileriz.</abbr> 
<q>: <q>Göztepe'ye 3. ligde başarılar dileriz.</q> 
</body>
</html>

Seçenekler
Yazdırılabilir şekli göster Sayfayı E-Mail olarak gönder
Stil
Normal Hybrid-Şeklinde gösterime geç Ağaç şeklinde gösterime geç

Benzer Konular
Konu	Konuyu Başlatan	Forum	Cevaplar	Son Mesaj
Ramazan uyku düzeni!	yergun_002	Sağlık Merkezi	3	26.08.08 14:21
html kodları	cimbomum	Network ve İnternet	1	24.03.08 14:50
html kodları	spettro	HTML,XML,JS	4	29.07.07 04:47

27.03.08, 22:48	#1
ibiramcan	HTML Metin Düzeni Paragraf Oluşturma Hatırlıyorsanız paragraf yapmak için <br> veya <pre> kodlarını kullanıyorduk. Oysa HTML'de sırf paragraf yapmakla görevlendirilmiş bir kod var: <p>...</p> arasına yazacağımız ifadeler paragraf halinde gösterilir. Hemen bir uygulama geliştirelim codeDivStart()Kod: <html> <head> <title>Kum Tanesi</title> </head> <body> <p>Sokaklarda bulurum kendimi yalnızlığımdan her kaçışımda. Cebimde ne sigara ne de para..."Kum tanesi" olduğumu bilirim ama gösteremem kendimi bir türlü dev haritalarda... Atlarım bir arabaya; "sür!" derim "Kızılay'a"...Eski bir sevgili gelir nedense aklıma; "Dön" derim "Ulus’a"... Barda çalışır adı"Ayça". Tahmin ettiğim gibi işte burada... Heyy gülüm hey şu anda kokteyl yapmakta; Biz duygularımızdan yapardık kokteyli sonra da sarhoş olurduk sevişirdik aldırmadan güneş ışıklarının vücudumuzu olduğu gibi gösteren aydınlığına... "Geri döneceğimi biliyormuş gibi "baktı suratımadudaklarında kendince haklı bir tebessüm haklı çıktı ya davasında... Dedim"ilan ı aşk yapmaya gelmedim; Param yoksigaram yok dışarıda taksi bekliyor üstelik evin anahtarını kaybettim üstelik kalacak yerim yok..." Ayça sever ya bizi halletti bütün işleri... Üstelik eski günlerdeki gibi sevişti...</p> <p>Neyse kafiyeyi bozmayalım...Sonraki gece aynı dert aynı tasa... Rakı radyoda çalan bir nihavend şarkı ve geçmişte yaşanmış ya da yaşanamamış bir kaç ağlatan anı birleşirler odamda... Eski bir sevgili gelir nedense aklıma... Atlarım arabaya; "Sür!" derim "Mithatpaşa’ya"... Lojmanlarda oturur edebiyat hocası adı "Selda"... Tahmin ettiğim gibi işte burada. Vayy gülüm vay geceliğiyle çıktı kapıya; En sevdiğim elbisesiydi bu aklımı alırdı her defasında... Bu kızlar hep böylemi hoca;Bu da "geleceğimi biliyormuş gibi" baktı suratıma. Üstelik aynı tebessüm... Benim derdimse aynı; "Geçiyordumuğradım". Güzel "afyan" u varmış "fayfe" yaptık içtik içtik içtik... Sonra da bulduk kendimizi yorgun bir sevişme sonrasında... Sanki yıllardır birlikteymişiz gibi rahattık...</p> <p>Kafiye gene bozuldu galiba neyse; Sonra atarım kendimi evimeodama. Yalnızlığım "tahmin ettiğim gibi" burada... Ah gülüm ahhen çok o bakar zaten suratıma"geri döneciğimi biliyormuşcasına". Tebessüm etmez soğuktur zaten bir tek o koyar bana. Yalnızlığın "çöl" olduğunu anlarım ben zaten "kum tanesi"... Sonra atlarım bir arabaya"Sür!" derim "Gaziosmanpaşa’ya"; ****lik yapar adı "Asuman"... Kafiye son isimde bozuldu ama; Boşveer bütün isimler "aynıdır" aslında...</p> </body> </html> Dikkat ederseniz yazdığınız paragraflar sola yaslanmış haldedir. Paragraf Hizalama Peki paragrafları nasıl sağa yaslarız veya ortalarız? Bunun için <p> kodunun bazı parametreleri vardır. Mesela paragrafı sağa yaslamak için kodu şöyle kullanırız:<p align="right">...</p> Ortalamak için: <p align="center">...</p>. Sola yaslamak için: <p align="left"> ...</p>. Hiçbir parametre kullanmazsak paragraf sola yaslanmış halde çıkacaktır. Aşağıdaki uygulamaya bakalım: codeDivStart()Kod: <html> <head> <title>Kum Tanesi</title> </head> <body> <p align="left">Sokaklarda bulurum kendimi yalnızlığımdan her kaçışımda. Cebimde ne sigara ne de para..."Kum tanesi" olduğumu bilirim ama gösteremem kendimi bir türlü dev haritalarda... Atlarım bir arabaya; "sür!" derim "Kızılay'a"...Eski bir sevgili gelir nedense aklıma; "Dön" derim "Ulus’a"... Barda çalışır adı"Ayça". Tahmin ettiğim gibi işte burada... Heyy gülüm hey şu anda kokteyl yapmakta; Biz duygularımızdan yapardık kokteyli sonra da sarhoş olurduk sevişirdik aldırmadan güneş ışıklarının vücudumuzu olduğu gibi gösteren aydınlığına... "Geri döneceğimi biliyormuş gibi "baktı suratımadudaklarında kendince haklı bir tebessüm haklı çıktı ya davasında... Dedim"ilan ı aşk yapmaya gelmedim; Param yoksigaram yok dışarıda taksi bekliyor üstelik evin anahtarını kaybettim üstelik kalacak yerim yok..." Ayça sever ya bizi halletti bütün işleri... Üstelik eski günlerdeki gibi sevişti...</p> <p align="right">Neyse kafiyeyi bozmayalım...Sonraki gece aynı dert aynı tasa... Rakı radyoda çalan bir nihavend şarkı ve geçmişte yaşanmış ya da yaşanamamış bir kaç ağlatan anı birleşirler odamda... Eski bir sevgili gelir nedense aklıma... Atlarım arabaya; "Sür!" derim "Mithatpaşa’ya"... Lojmanlarda oturur edebiyat hocası adı "Selda"... Tahmin ettiğim gibi işte burada. Vayy gülüm vay geceliğiyle çıktı kapıya; En sevdiğim elbisesiydi bu aklımı alırdı her defasında... Bu kızlar hep böylemi hoca;Bu da "geleceğimi biliyormuş gibi" baktı suratıma. Üstelik aynı tebessüm... Benim derdimse aynı; "Geçiyordumuğradım". Güzel "afyan" u varmış "fayfe" yaptık içtik içtik içtik... Sonra da bulduk kendimizi yorgun bir sevişme sonrasında... Sanki yıllardır birlikteymişiz gibi rahattık...</p> <p align="center">Kafiye gene bozuldu galiba neyse; Sonra atarım kendimi evimeodama. Yalnızlığım "tahmin ettiğim gibi" burada... Ah gülüm ahhen çok o bakar zaten suratıma"geri döneciğimi biliyormuşcasına". Tebessüm etmez soğuktur zaten bir tek o koyar bana. Yalnızlığın "çöl" olduğunu anlarım ben zaten "kum tanesi"... Sonra atlarım bir arabaya"Sür!" derim "Gaziosmanpaşa’ya"; **lik yapar adı "Asuman"... Kafiye son isimde bozuldu ama; Boşveer bütün isimler "aynıdır" aslında...</p> </body> </html> Şimdi uzun örneğimizin ilk paragrafı sola yaslanmış ikinci paragrafı sağa yaslanmış üçüncü paragraf ise ortalanmış haldedir. Paragrafı yazı editörlerinde yapıldığı gibi iki yana yaslamak da mümkün ancak bunu ileri ki bölümlerde göreceğiz...<p> kodunu web sayfalarını tasarlarken çok sık kullanacağımızı göreceksiniz. Tanıtıcı Mesaj Parametresi Size <p> kodunun bir başka parametresini de vereyim: "title". <p title="tanıtıcı mesaj" >...</p> arasına yazılan bir paragrafın üzerine fareyi getirdiğimizde yazdığımız mesajla karşılaşırız. Örnekle görelim: codeDivStart()Kod: <html> <head> <title>Paragraf Örneği</title> </head> <body> <p align="left" title="Bu ananonim bir dize.">Kırlangıç yapar yuvayı; çamur sıvayı sıvayı</p> <p align="left" title="Bu da ananonim bir dizedir.">Duvarın dibinde resmim aldılar; ak kağıt üstünde tanıyın beni</p> </body> </html> u örnek de paragraflara hem align hem de title parametrelerini uyguladık. Bu tür parametrelerin birçok kod için geçerli olduğunu ileride göreceğiz. Yaptığımız son uygulamada ilk paragrafın üzerine farenin imlecini bir-iki saniyeliğine (size on saniye gibi gelecek) bıraktığımızda "Bu ananonim bir dize." mesajını göreceğiz. Bu da HTML sayfalarının bir başka özelliği. Karakter Kodları HTML kodu yazarken bıraktığımız birden fazla boşlukların dikkate alınmadığı ve tek boşluk gibi gösterildiğini önceki sayfada söylemiştik. Birden fazla boşluğun görülebilmesi için metin editörünün formatını doğrudan web sayfalarına taşıyan <pre> kodunu kullanıyorduk. Oysa bu yolu izlemek zorunda değiliz;   kodu bir boşluk karakterine karşılık gelir. Mesela paragraf başı yapmak istiyoruz. Bunun için paragrafın başına 5 boşluk karakteri koymak istiyoruz diyelim. N'apacağız? codeDivStart()Kod: <html> <head> <title>Kentsel Mimari</title> </head> <body>      Balıkların hafızası üç saniyedir. Üç saniye sonra üç saniye önceki yaşamlarından koparlar. Böylece üç saniyede ancak katettikleri akvaryumu bir okyanusmuşcasına gezerler yaşamları boyunca. Yaşam onlara her üç saniyede yeni bir şey getirir monotonluk onlar için 3 saniyeyi aşamayacak bir kavram. </body> </html> Bu uygulamayla gördük ki HTML'in görmediği bazı karakterleri yazdırabilmek için kodlara (işlevsel olarak ASCII kodlarına benzer) ihtiyacımız vardır. Örneğin ben bu web sayfasında size HTML kodlarını anlatırken bu kodlardan yararlanıyorum. Yoksa HTML'de "<HTML>" kelimesini normal yazarak gösteremeyiz. Çünkü web sayfası oluşturulurken HTML derleyicisi "<HTML>" kelimesini metinsel bir ifade olarak değil bir HTML kodu olarak algılar. Böyle olmaması için "<" karakteri yerine < ">" karakteri yerine de > kodlarını kullanırız. Bunu bir uygulamayla gösterelim: codeDivStart()Kod: <html> <head> <title>HTML Kodları</title> </head> <body> <b><html></b> kodu HTML uygulamalarının başlangıç kodudur.<br/> <b><title></b> kodu web sayfasının başlığını yazmak için kullanılır.<br/> <b><p></b> kodu ile web sayfalarında paragraflar oluşturabiliriz.<br/> <b><pre></b> kodu ile metin editörlerinin formatını web sayfalarına taşırız.<br/> <b><br></b> kodu ile metnin bir satır aşağıya atlamasını sağlarız.<br/> <b><b></b> kodu ile metinsel ifadelerin koyu (bold) olmasını sağlarız.<br/> </body> </html> Biraz akıl karıştırıcı değil mi? Sayfada nelerin çıkması gerektiğini kodu yazarken gözünüzde canlandırabiliyorsanız bu işi kapmışsınız demektir. Bu tip karakter kodlarını kullanırken yaptığınız işi denetlemeyi unutmayın. HTML'in sizi uyaracağını falan düşünmeyin bile. HTML hataları görmezden gelir ve bünyesinde taşır. (XHTML derslerinde bu konuya ayrıntılı şekilde değineceğim.) Tabi bu karakter kodlarını ezberleyim falan demeyin; yine de   kodunun aklınızda kalması yararlıdır. Yazı Komutları** Karakter kodları parametreler falan filan. Bu konuların biraz can sıkıcı olduğunu biliyorum. Bilgisayar dillerine pek alışkın olmayan kişiler bir dilin tüm komutlarını parametrelerini öğrenmeden kendilerini güven içinde hissetmezler. Oysa bu bilgisayar fobisi aşılamadan yazılımcı olunamaz. Önemli olan algoritma yapısını ve dilin kendine has ritmini yakalayabilmek. (Bu sözleri edebiyat parçalamak için değil olayın felsefesini anlatabilmek için yazıyorum.) HTML'in çok az kodunu öğrenmeniz bile yeterli olabilir; kaldı ki kod bakımından HTML çok da zengin sayılmaz. Hiç kimse tüm komutları tüm fonksiyonları tüm parametreleri aklında tutmaz. Zaten dil tıpkı yaşayan bir organizma gibi bir değişim bir evrim sürecindedir. Bazı kodlar eskimiş körelmiş kullanılırlığı kalmamıştır. HTML'de böyle bir çok kod var. Bunları bilseniz de olur bilmeseniz de. Önemli olan yapacağınız uygulamayı zihninizde modelleyebilmek yoksa ne kadar komut bildiğinizin; o komutları verimli bir şekilde kullanamadıkça pek önemi yok. Şimdi pek kullanılmayan ama literatürde rastlayabileceğiniz bu tür bazı komutları yazıyorum. Bunları aklınızda tutmaya çalışmayın sadece göz aşinâlığınız bulunsun. Kullanmanız gerektiğinde "böyle şeyler vardı açıp bakayım" dersiniz. <address></address> Arasına yazılan metinsel ifadeyi adres formatına çevirir. (nasıl birşey olduğunu merak edenler denesin; çok kullanılan bir şey değil) <bdo dir="rtl"></bdo> Arasına yazılan metinsel ifadeyi tersine çevirir. "Banu"'yu "unaB" yapar. Bu kod olmasaydı insanoğlu n'apardı bilemiyorum. <sample></sample> Arasına yazılan metni "sample" (örneklem) moduna çevirir. (Matah birşey zannetmeyin merak eden denesin.) <code></code> Arasına yazılan metni "code" (kod) moduna çevirir. Bilgisayar kodlarını web sayfasına yazacaksanız tavsiye ederim. <kbd></kbd> Arasına yazılan metni "keyboard" (klavye/daktilo) moduna çevirir. <tt></tt> Arasına yazılan metni "teletip metin" moduna çevirir. <var></var> Arasına yazılan metni "variable" (var) moduna çevirir. (not: değişken tanımlama gibi birşey zannetmeyin yukarıdakiler gibi gereksiz birşey.) <acronym></acronym> Arasına yazılan metni kısaltma moduna çevirir. <abbr></abbr> Arasına yazılan metni yine kısaltma moduna çevirir. <q></q> Arasına yazılan metni "quotation" (alıntı) moduna çevirir. (Pek faydalı birşey değil.) Bunların hepsini kapsayan bir örnek yapalım. codeDivStart()Kod: <html> <head> <title>Çok Faydalı HTML Kodları</title> </head> <body> <b><address>:</b> <address>Göztepe'ye 3. ligde başarılar dileriz.</address><br/> <b><bdo dir="rtl">:</b> <bdo dir="rtl">Göztepe'ye 3. ligde başarılar dileriz.</bdo><br/> <b><sample>:</b> <sample>Göztepe'ye 3. ligde başarılar dileriz.</sample><br/> <b><code>:</b> <code>Göztepe'ye 3. ligde başarılar dileriz.</code><br/> <b><kbd>:</b> <kbd>Göztepe'ye 3. ligde başarılar dileriz.</kbd><br/> <b><tt>:</b> <tt>Göztepe'ye 3. ligde başarılar dileriz.</tt><br/> <b><var>:</b> <var>Göztepe'ye 3. ligde başarılar dileriz.</var><br/> <b><acronym>:</b> <acronym>Göztepe'ye 3. ligde başarılar dileriz.</acronym><br/> <b><abbr>:</b> <abbr>Göztepe'ye 3. ligde başarılar dileriz.</abbr><br/> <b><q>:</b> <q>Göztepe'ye 3. ligde başarılar dileriz.</q><br/> </body> </html>

Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir)

HTML Metin Düzeni

HTML Metin Düzeni

Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir)

Benzer Konular