Demekki bir Web Sayfası hazırlamak istiyorsunuz!
İşiniz var..
Ders 2!..
Karışıklığa sebep vermemek için <BODY> taglerinin içini
yazacağım. Bunadan sonra <HTML>,
<HEAD> & <TITLE> taglerini artık yazmayacağım
ama siz mutlaka yazın. (ben kısaltmış olmak için yazmıyorum-belirteyim).
<BODY>
</BODY>
Güzel bir şey yazın.
<BODY>
Güzel bir şey
</BODY>
Dökümanda herhangi bir şey değiştirdiniz mi mutlaka "Kayıt" ile saklatın,
"Yenile" yi tıklayın ve değişikliği hemen gözlemleyinki ne olduğunu anlayabilesiniz
Sanırım
ilk öğrenmemeiz gereken background - fon - renginin nasıl değiştiği.
<BODY BGCOLOR="#FFFF00">
Güzel bir şey
</BODY>
FFFF00 sarı renginin HEX kodudur. Tıklarsanız
burada biraz daha var.
Dilerseniz
arkaplanı image - resim - de yerleştirebilirsiniz.
DİKKAT : image -resim- sizin HTML dosyanızla (sayfanızla) aynı folder -klasör- de olmalı.
Yoksa resimleriniz çıkmaz. Resimleri göremezseniz endişelenmeyin, mutlaka aynı klasörde değildir veya GIF ve JPG dosyalarınızı
Türkçe harfler kullanarak isimlendirmiş olabilirsiniz.
Kodun yazılışı ise aşağıdaki gibidir:
<BODY BACKGROUND="fon.gif">
Güzel bir şey
</BODY>
Arkaplan image ı burada
İmage in görünebilmesi için aynı HTML dosyanızla aynı klasörde olması gerek.
Bunun en kolay yolu , image ın üzerine sağ tıklayıp birinci derste yaptığınız
sayfa bilgisayarın hangi bölümünde ise hemen onun yanına Resmi Farklı Kaydet yapın
Eski düz beyaz ekrana gidelim tekrar.
<BODY BGCOLOR="#FFFFFF">
Güzel bir şey
</BODY>
İstersek yazıları böyle Kalın yapabiliriz.
<BODY BGCOLOR="#FFFFFF">
Güzel bir <B>şey</B>
</BODY>
Biz aslında browsere diyoruz ki<B> görünce
harfleri kalın yapmağa başla </B> görüncede durdur.
Aybı kural italikler içinde geçerlidir....
<BODY BGCOLOR="#FFFFFF">
Güzel <I>bir</I>
<B>şey</B>
</BODY>
vede.. altçizgi.
<BODY BGCOLOR="#FFFFFF">
<U>güzel</U>
<I>bir</I> <B>şey</B>
</BODY>
Beyaz ekrana tekrar dönelim.
<BODY BGCOLOR="#FFFFFF">
Güzel bir şey
</BODY>
İstersek tagleri birlikte kullanabiliriz.
<BODY BGCOLOR="#FFFFFF">
Güzel bir <I><B>şey</B></I>
</BODY>
Bu nested - yani içiçe geçmiş - taglere örnektir. İlerde etiketleri birlikte
kullandığınız zaman aşağıdaki şekilde yapın yoksa browserin kafasını karıştırırsınız.
<THIS><THAT></THIS></THAT> Karışık yani
HATALI
<THIS><THAT></THAT></THIS> Nested
DOĞRUSU BÖYLE
Elbette font
size
too font ebatlarıda değişir... Nasıl mı? - Çok kolay.
Önce <FONT> taglerini ilave edin...
<BODY BGCOLOR="#FFFFFF">
Güzel bir<FONT>şey</FONT>
</BODY>
Sonra SIZE ebat özelliğini belirtin.
<BODY BGCOLOR="#FFFFFF">
Güzel bir <FONT SIZE=6>şey</FONT>
</BODY>
Fontlar 7 ebatta gelir:
| minik |
küçük |
normal |
büyücek |
büyük |
gerçekten büyük |
jumboo! |
| 1 |
2 |
3 |
4 |
5 |
6 |
7 |
Şimdi iki şeyi tartışalım. <TAG> browsere bir şeyi yapmasını söyler ve
ATTRIBUTE ise <TAG> içine girer ve browsere nasıl
yapacağını söyler.
İkinci nokta ise defaultlar yani varsayılanlar. Eğer hiçbirşey
belirtilmemişse browser varsayılan değerleri atar. Mesela font ölçülerinde
varsayılan değer 3 tür. bir şey belirtmezseniz browser 3 varsayarak
karakterleri yazar.
Her
browserin değişik varsayılan font ayarları vardır. Eğer PCnizi
fazla kurcalamadı iseniz varsayılan ayarları " Times
New Roman 12pt ve siyah renk tir". Ama ARIAL and COMIC
SANS gibi değişik fontlarda vardır.
<BODY BGCOLOR="#FFFFFF">
Güzel bir <FONT FACE="ARIAL">şey</FONT>
</BODY>
Tabii fontların gözükmesi için PCnize yüklü olması gerekir. Tekrarlayayım
eğer sayfanıza bakan kimse, sizin belirttiğiniz fontlar bilgisayarına yüklü
değilse, sadece kendi bilgisayarının varsayılan fontunu görür. Onun için
fontlarınızla biraz dikkatli olun.Arial ve Comic Sans MS Windows ile
gelen yaygın fontlardandır. Aynı şekilde Impact! da.
Yapmanız gereken, işi garantiye almak için birden fazla font belirtmeniz. (Evet! yapabilirsiniz)
Bunlardan birini yapın.. <FONT FACE="ARIAL, HELVETICA,
LUCIDA SANS">Hidee Ho</FONT>.
Benim gibi jetonu geç düşenlere açıklayayım. Olay şu: Sayfa yüklenirken browser
ARIAL arar. Bulursa kullanır, bulamadı ozaman HELVETICA yı arar.
Bulursa kullanır olmadı LUCIDA SANSı gider bakar. Onuda bulamazsa çaresiz
varsayılan fontu kullanır.
Evvet, eğlenceye geri dönelim..
İsterseniz font rengini değiştirebilirsiniz.
<BODY BGCOLOR="#FFFFFF">
Güzel bir <FONT COLOR="#FF0000">şey</FONT>
</BODY>
İstersek birden fazla özelliği <TAG> içine yerleştirebiliriz...
<BODY BGCOLOR="#FFFFFF">
Güzel bir <FONT COLOR="#FF0000" FACE="ARIAL"
SIZE="7">şey</FONT>
</BODY>
Elbette bu kadar değil!
<BODY BGCOLOR="#FFFFFF">
Güzel bir <U><I><B><FONT
COLOR="#FF0000" FACE="ARIAL" SIZE="7">şey</FONT></B></I></U>
</BODY>
Tekrar belirteyim, birden fazla tag nested olmalı.
<TAG3><TAG2><TAG1>Hooha!</TAG1></TAG2></TAG3>
Hangisinin önce olduğu mühim değil. Bir şeyi kırmızı ve kalın
yapmak için sıra farketmez. İstediğiniz sırada yapabilirsiniz.
<TAG2><TAG1><TAG3>Hooha!</TAG3></TAG1></TAG2>
Kendinizi ve browserin kafasını karıştırmak için en kestirme yol, etiketlerin sırasını
karıştırmaktır.
The fastest way to confuse the browser, not to mention yourself is to
overlap the tags...
<TAG3><TAG2><TAG1>Hooha!</TAG3></TAG1></TAG2>
Son
olarak: Browserin text rengi, link rengi, aktif link rengi ve ziyaret edilmiş link
rengi ve ekran fon rengi için varsayılan değerleri vardır. Şöyleki:
Text siyahtır
Linkler mavi
Actif link kırmızı
Ziyaret edilmiş link mor
|
Eğer ihtiyacınız olursa bunları değiştirebilirsiniz (ihtiyacınız olursa dedim!)
Bütün dünya linkleri mavi görmeğe alışmıştır. Lütfen fazla değişiklik yapıp
kafaları karıştırmayın. Bütün döküman için varsayılanları
<BODY> etiketinin içinde değiştirebilirsiniz.
<BODY BGCOLOR="#00000" TEXT="#FFFF00"
LINK="#FF0000" VLINK="#800000" ALINK="#008000">
Güzel bir şey
</BODY>
Güzel bir şey
Şimdi linkleri öğrenmeden neden suyu bulandırıyorsun diyebilirsiniz!!
Haklısınız ama yakında linkleri yapmasını nasılsa öğreneceksiniz. Hiç
değilse şimdiden renkleri değiştirmesini öğrendiniz.
Şimdi görüyorsunuz fon siyah ve text sarı.
Linkler şimdi kırmızı
Ziyaret edilmiş linkle
bordo
ve aktif linkler ise yeşil.
|
Dersi kapatmadan, bir şeye dikkatinizi çekmek isterim. Eğer bir sayfanın HTML kodunu
merak ediyorsanız, görmek için sayfanın üzerinde sağ tıklayıp, Kaynağı Görüntüleyi
tıklarsanız açılan Notepad penceresinden HTML kodunu görürsünüz.
Ama sağ tıklamaya kimi arkadaşlar çok mühim keşiflerinide saklamışlarsada zamanı gelişnce
sayfayı sağ tıklamaya kapatmanında pek çözüm olmadığını öğrenirsiniz. İyi haftalar....
< Ders 1
Ders 3 >
| 
