|
HTML DİLİ I) Komutlar 1) Sayfa Yapısını belirleyen kodlar
Not Defteri (artık kısaca notepad diyeceğim)'nde en yukardan yazmaya başlayabilirsiniz.
( Mavi yazılı yerlerin her birini < ile > arasına yazmanız lazım, bazı mavi yazılı kodların başında noktalar ve sonunda '>' var ise aynen yazmanız yeterlidir.
a) html :Bir Web Sayfasının baslanğıcıdır, mutlaka en başta kullanılır. Sayfanın en sonunda /html yazılarak sayfa bitirilir.
b) head :Sayfanın baslangıç bölümünü tanımlar, bunu yazdıktan sonra diğer komutlar ile sayfada calışması gereken diğer dosyalar, müzikler, vs. ile sayfa baslığı gibi giriş bilgileri yazılr. /head ile biter.
c) title :head'dan sonra kullanılır, en yukarıda pencere çubuğunda görünen sayfa başlığını yazarız. /title ile biter. örnek: title Blogcu Anılarım title
d) body :Belge başı. Sayfanın özellikleri de belirtilir. /body ile sayfada gorüntülenen herseyin sonu belirtilir (sayfa sonu).
Bugünlük örnek sayfamız: (Bunları notepad ile yazın ve dosyaya çift tıklayıp açın, sonucu görün)
İlk Örnek Sayfa Denememiz html head title Deneme Amaçlı İlk Sayfa /title /head body Blogcudan'tan Merhaba! /body /html
Tabii ki herşeyi böyle alt alta, satırlara birer birer yazmak gibi bir mecburiyetiniz yok."
1) Sayfa Yapısını belirleyen kodlar i) body tag'i (Aşağıdakiler "body" ile ">" arasında yer alır: Evet bu 'tag' sadece sayfa başı ve sonunu belirlemiyor, daha birçok özelliği var:
* ...leftmargin=x> Sayfada soldaki resim ve yazılar pencerenin ne kadar içinden başlayacak. (Hemen sol pencere çubuğuna yapışmış şeyler hoş gözükmez) "x" yerine rakam vererek nokta sayısını belirtirsiniz, yalnız önemli olan şu ki bu ayar bir satır için değil tüm sayfa için geçerli. İsterseniz x yerine 0 verip sola yapıştırabilir, ister 50, 60, vs. verip iyice içerden başlayabilirsiniz.
* ...topmargin=x> Yukardaki komut gibi kullanılır ama yazı ve resimlerin ne kadar yukardan başlayacağını ayarlamak içindir. Mesela bazı resimler sayfada en yukarıya yapışınca hiç de güzel bir görüntü oluşmaz.
* ...bgcolor="x"> Bu sayfanın arka plan rengini belirlemek için kullanılır. Mesela benim sitemdeki sayfalarin arka planı siyah olsun ve ben bunu bu komutla yapiyorum. "x" yerine renklerin İngilizce isimleri veya rakam ve harf kodlari verilir.
* ...background="resim.adı"> Bununla sayfanın arkaplanı duz bir renkle degil duvar kagidi gibi bir resimle kaplanabilir. (Windows masaustu gibi) Tırnaklar arasına istediğiniz resmin adını yazarsınız ve arkaplan bu resimle kaplanır. Fakat ilk giriş dersimizde söylemeyi unuttuğum iki şey var: -Internet üzerinde sadece .gif ve .jpg resim kullanilir. Diğer türleri destleyen bazı sistemler mevcud fakat bu genel içindir. -Kullanacağımız resimler sayfayla aynı klasorun içinde olmalı yoksa daha uzun komutlar gerekir. Eğer bir resmi arkaplan olarak kullanırsak "bgcolor" ile arkaplan rengine ihtiyaç olmaz. (nasıl olsa resim kaplayacak)(eğer blogunuza atmak istiyorsanız sayfanın sağ altında resim host yazan yerden resminizi host ettirin ve gelen kodu resim adı yerine girin.)
* ...text="#xxxxxx"> Bir süre sonra yazı tiplerini göreceksiniz. Diyelim ki sayfada devamlı yazıtipi komutları kullanmak istemiyorsunuz, o zaman xxxxxx yerine girdiğiniz renk kodu (veya rengin İngilizce adı, örneğin "red") sayfadaki yazilarin standart rengi olur. (Kullanmak zorunda tabii ki değilsiniz ve burada belirttiğiniz rengi bazı yerlerde aşağıdaki komutları kullanıp tabii ki değiştirebilirsiniz yani siz belirtince tüm yazılar bu renk olmaz)
body örnekleri: i) Arka plan sarı: html head title Deneme Amaçlı İlk Sayfa /title /head body bgcolor="#ffff00" text="#ffff00" leftmargin=10 topmargin=50 Merhaba... /body /html
Bu örnekte sarı arkaplan üzerine soldan 10 piksel(nokta) yukardan 50 piksel uzaklıkta Merhaba yazdık. (#: ctrl+alt+3 ile yazilir)
ii) Arka plan resimli: html head title Deneme Amaçlı İlk Sayfa /title /head body background="webloger01.gif" text="#ffff00" leftmargin=10 topmargin=50 Merhaba... /body /html
Bu örnekte arkaplana webloger01.gif isimli resmi döşedik ve üzerine soldan 10 piksel(nokta) yukardan 50 piksel uzaklıkta Merhaba yazdık. Tabii ki body kodunun yanına daha birçok şey gelebiliyor ama onları yeri geldikçe açıklayacağım. (şimdiden gereksiz bilgiler kafa karıştırmasın)
2) Yazitipleri Ayar komutları Yazı yazmak için daha cok font tagını kullanacağız ama önce diğerlerine değinmek istiyorum: i) * b... /b: Daha öncede belirttigim gibi coğu tag /tagınadı yazılarak sona erdiriliyor. Burada da ile arasına yazılanlar bold yani koyu olarak ekrana geliyor. * i... /i : Bu sefer aradakiler italik yani yana yatik yazı. * -... - : Bu sefer de aradakiler alt çizgili. * -... - : x yerine 1-7 arası bir sayı verilir. 1 en büyük, 7 en küçük yazar.
ii) -... - Evet aslında hep bunu kullanacağınızı sanıyorum. örneğin font color="#ffff00" size=x face="x"> Burada color, size veya face eklerinden biri yada birkaçı olmayabilir. * ...color="#xxxxxx"... : Buraya bir renk verilirse /font'a kadar olan yazılar o renk görülür. * ...size=x: Buraya 1-5 arası girilen sayı yazının büyüklüğünü belirtir; h 'nin tersine büyük rakam daha büyük yazar; ama 1'den de küçük isterseniz font yerine h6'yi; 5'den büyük isterseniz h1'i kullanın. * ...face="x": /font'a kadar yazıtipini değiştiririr. (Word'deki yazıtipleri gibi) Belirtmezseniz standart "Times New Roman" kullanılır. Internet'te bir sayfadaki bir yazıtipi hoşunuza giderse o sayfanın kaynagını açın; yazının geçtiği bölümü bulup yazıtipi adını ögrenip kullanabilirsiniz. Mesela "arial" fontu Internet'te cok kullanılır ama bu "times"'a göre daha büyüktür.
Örnek: font color="#00ff00" size=3 face="trebuchet ms" Merhaba bu yazının boyutu '3' ve fontu 'trebuchet', rengi de yeşil! font yazarsak şu çıkacaktır: (ayrıca #00ff00 yerine green de yazabiliriz) Merhaba bu yazının boyutu '3' ve fontu 'trebuchet', rengi de yeşil!
" |