HTML e Giriş
Bende herkes gibi HTML e Giriş diyerek başlamak istedim. Gerçekten gerçekçi bir söz. HTML e Giriş. Çünkü bu kısım hakkında pek çok şey biliyorum diyenler bile şaşırabilir. bu yüzden az yada çok bilin bu yazının devamını mutlaka okuyun.
<html></html> Neden HTML başka birşey olamaz mı?
Aslında doğru bir soru. HTML; internet için tek tasarlama dili mi? Hep adını duyduğumuz ya başka yolu yok mu dediğimiz sayfa tasarımının aslında birçok tasarlama yöntemi vardır. HTML, ASP, CGI, PHP ....... ama içlerinde temel olarak HTML basit ve kullanışlıdır.
HTML Olunca Ne Oluyor?
Hipertext işaretleme (HTML) dili oluyor. ???? . Bir text dökümanının; her farklı kısmı için ayrı bir komutun kullanıldığı, ek özelliklerin ve resimlerin yanında bulunan dosyalardan alınıp, sayfanın belirlenen kısımlarına konulduğu bir komutsal text biçimidir.
Nasıl Başlanır?
İlk önce kendinize bu konu ile ilgili bir site bulmalısınız. Biz
www.bilimveteknoloji.com adresini öneriyoruz.) Daha sonra kendinize bir not defteri edinin. En son olarak bu sayfanın devamını okuyun. Başarılar.......
Komut Mantığı
Html komutları TAG lardan oluşmaktadır. Her tag < karakteri ile başlayıp > karakteri ile bitmektedir. Komutlar tagların içerisinde, kmuttan etkilenen nesne ise taglar arasında olmaktadır. "<center>" yazılımı bir tagdır. Ortalama manasına gelir. Tagın geçerli olduğu alanı sonlandırmak için "</center>" yazılır. Buradan sonraki nesnelere artık ortalama özelliği uygulanmayacaktır. "<center>deneme</center>" komut dizisinde "deneme" yazısı bulunduğu satır içerisinde ortalanmaktadır. Tagların hemen hemen hepsi açıldıktan sonra kapatılmalıdır. Önce açılan tagların; sonra açılanlardan daha sonra kapatılması sayfa düzeni için gereklidir. Açıldıktan sonra kapatılması gerekmeyen taglarda bulunmaktadır. bunlar direk tag içerisindekinesneye etki ederler. <img src="deneme.gif"> tagında deneme.gif isimli dosya sayfaya eklenmiştir. Bu tarz tagların, ikinci bir tag ile kapatılması gerekmemektedir.
Sayfa Yapısı
Html sayfa içerisinde sayfa özelliklerinin ve sayfa içeriğinin yazıldığı iki ana kısım bulunmaktadır. Sayfa <html></html> tagları arasında olmalıdır. Bu taglar arasında sayfa özelliklerinin tanımlandığı <head></head> tagları arasında kalan ilk bölüm ile ; sayfa içeriğinin bulunduğu, <body></body> tagları arasındakiikinci kısım bulunmaktadır.
Komutlar
Komutlar da sayfa yapısına bağlı olarak iki ana gruba ayrılırlar.
1 - Sayfa özelliğini belirleyen komutlar.
2 - Sayfa içeriğini belirleyen komutlar.
Sayfa özelliğini belirleyen komutlar; sayfa başlığı, içeriği, kime ait olduğu, hangi dilde yazıldığı, hangi karakter setinin kullanıldığı gibi bölümleri içerir.
Sayfa içeriğini belirleyen komutlar ise; Sayfada buluna yazılar, resimler, tablolar, linkler ve benzeri nesneleri içerirler.
<title> : Sayfanın başlığının ne olacağını belirler. Sayfanın başlık çubuğundaki yazıyı ayarlamak için kullanılır. <head></head> tagları arasında kullanılır. Kullanımı <title>Yazılacak Olan Başlık</title> şeklindedir..
<br> : Sayfada bir alt satıra gitmek için kullanılır. Kullanıldığı yerdeki satılar arasında boşluk oluşmaz. Kullanımı <br> şeklindedir.
<p> : Sayfada bir alt satıra gitmek için kullanılır. Kullanıldığı yerdeki satırlar arasında boşluk oluşturur. Kullanımı <p> Şeklindedir.
<hx> : Sayfada x standartında yazı yazılmasını sağlar. x yerine bir rakam yazılmaktadır. <h1> en büyük standartı oluşturur. x sayısı arttıkça boyut küçülür. Tabi kullanıcı standartını değiştirmemişse. Kullanımı <hx></hx> şaklindedir.
<hr> : Sayfa içerisinde yatay çizgi oluşturmak için kullanılır. Oluşturulan çizgi bir satırı kaplamaktadır. Çizgi ile aynı satıra başka nesne veya yazı konamaz. Kullanımı <hr> şeklindedir.
<center> : Sayfa içerisindeki yazı veya nesnenin o satır içerisinde ortalanmasını sağlar. Kullanımı <center>Ortalanacak Yazı</center> şeklindedir.
<b> : Sayfa içerisindeki yazının kalın (bold) yazılmasını sağlar. Kullanımı <b>Kalın Yazılacak Yazı</b> şeklindedir.
<i> : Sayfa içerisindeki yazının yatık (italik) yazılmasını sağlar. Kullanımı <i>Yatık Yazılacak Yazı</i> şeklindedir.
<u> : Sayfa içerisindeki yazının altı çizgili (under line) yazılmasını sağlar. Kullanımı <u>Altı Çizgili Yazılacak Yazı</u> şeklindedir.
<font> : Yazılacak yazının özelliklerini belirlemek için kullanılır. İç elemanları ile yazının değişik özelliklerini ayarlamamızı sağlar.
face : Yazının font özelliğnin ayarlanması için kullanılır. Kullanımı <font face="Fontun Adı">Fontu Ayarlanacak Yazı</font>
size : Yazının büyüklüğünü ayarlamak için kullanılır.Yazının büyüklüğü rakam ile belirtilir. Kullanımı <font size="Yazını Büyüklüğü">Büyüklüğü Ayarlanacak Yazı</font>
color : Yazının rengini ayarlamak için kullanılır. Yazının rengi hexadecima olarak belirtilir. Kullanımı <font color="Yazı Renginin Hexadecimal Değeri">Rengi Ayarlanacak Yazı</font>
Hepsi bir arada da kullanılabilir. <font face="arial" size="5" color="#102DAF">
<a> : Sayfanın bir bölümünü adreslemeye, adreslenen kısmı çağırmaya, belirtilen koşulda bir olayı gerçekleştirmeye yarar.
Adreslenen kısmı vey bir yolu çağırmak için kullanılan nesne veya yazıya kısayol denilir.
name : Belirtilen nesnenin veya yaının adreslenmesini sağlar. Bu adresleme sayesinde sayfa içerisindeki herhangibir butona basıldığında, adreslenmiş kısmının sayfa başına gelmesi sağlanır. Kullanımı <a name="Verilecek İsim">Adreslenen nesne</a>
href : Sayfa içerisindeki adreslenmiş bir kısma gitmeye, ayrı bir sayfa açmaya, belirlenmiş bir dosyayı indirmeye, kısacası bir yolu çağırmaya yarar.Kullanımı <a href="Çağrılacak Yol">Yolu Çağrılmak İçin Basılacak Nesne veya Yazı</a>
onmouseover :Belirtilen yolun, kısayol üstüne gelindiğinde çağrılmasını sağlar. Kullanımı <a onmouseover="Çağrılacak Yol">Kısayol</a>
onclick :Belirtilen yolun, kısayol tıklanıp çekildiğinde çağrılmasını sağlar.Yolun çağrılması için mous kliğinin basıldıktan sonra bırakılması gerekmektedir. Kullanımı <a onclik="Çağrılacak Yol">Kısayol</a>
onmousedown :Belirtilen yolun, kısayol tıklandığında çağrılmasını sağlar.Yolun çağrılması için mous kliğinin basıldıktan sonra bırakılmasına gerek yoktur. Kullanımı <a onmousedown="Çağrılacak Yol">Kısayol</a>
onmouseout :Belirtilen yolun kısayol üstünden mouseun çekildiğinde çağrılmasını sağlar.Mousun kısayol üzerini kliklemesine gerek yoktur. Kullanımı <a onmouseout="Çağrılacak Yol">Kısayol</a>
onmouseout :Belirtilen yolun kısayol üstünden mouseun çekildiğinde çağrılmasını sağlar.Mousun kısayol üzerini kliklemesine gerek yoktur. Kullanımı <a onmouseout="Çağrılacak Yol">Kısayol</a>
<img> : Sayfa içerisine resim dosyası koymak için kullanılır.
<src> : Konulacak resim dosyasını yerini ve adını belirtmek için kullanılır. Kullanımı <img src = "Resimin yeri ve adı">
<alt> : Resim için bilgi koymaya yarar. Resim bulunamadığı zaman veya açılana kadar yerine burada yazılan metin gelir. Resimin üzerine gelindiğinde yine aynı açıklama ek bir pencere içerinde gözükür. Kullanımı <img src = "Resimin yeri ve adı" alt="Açıklama Metini">
<border> :Resimin dış çerçevesinin olup olamayacağını belirler. border = 1 için çerçeve vardır; border = 0 için çerçeve yoktur. Kullanımı <img src = "Resimin yeri ve adı" border = 0 >
<width> : Resimin genişliğini ayarlar. Kullanımı <img src = "Resimin yeri ve adı" width = "resimin genişliği">
<height> : Resimin yüksekliğini ayarlar. Kullanımı <img src = "Resimin yeri ve adı" height = "resimin yüksekliğii">
<select>...</select>: Select elemanı kullanıcıya seçebilmesi için bir liste verir ve bu listeden sadece birisinin seçilmesine olanak tanır. Eğer birden fazla seçim yapılmasına olanak tanınacak ise Mutiple parametresi kullanılır.
name : Select elemanı ile kullanılan değişkenin adını belirtir. Kullanımı name = "değişkeninadı"
size : Görüntülenecek textin satır sayısını belirtir. Kullanımı size = "n"
Örnek :
<select size="1" name="secimler" multiple>
<option value="1.secildi">seçim1</option>
<option value="2.secildi">seçim2</option>
</select>
<textarea>...</textarea> : Bir text grubun kullanıcı tarafından girilmesine izin verir.
cols : Textarea nın genişliğini belirtir. Kullanımı cols = "n"
name : Textarea ya girilen metinin atılacağı değişkeni belirler.
rows : Textarea içerisind ki satır sayısını belirler. Kullanımı rows = "n"
Örnek :
<input type="text" name="degisken1" size="20">
<input> : Input elemanı kullanıcının sayfa üzerindeki değişken ve datalara etki edebilmesini sağlar.
name : Input elemanının içerdiği bilginin tutulacağı değişkeni belirtir. Kullanım name = "değişkenin adı"
type : Kullanıcıdan bilgi alınma ve seçenekleri sunuş şekillerini belirtir. İçerdiği seçenekler; "chekbox","hidden","image",radio",reset","submit", "text" dir.
align : Belirtilen nesnenin sayfa içerisindeki duracağı konumu belirtir. "top","middle","bottom" seçeneklerini içerir.
checked : Chekbox veya radio seçeneklerinden biri seçilmiş ise bu seçeneklerin seçili olup olmadığını belirtir.
value : Input elemanının ilk değerini belirtir.
Örnekler :
<input type="radio" value="V1" checked name="R1"><input type="radio" value="V1" checked name="R1">
<input type="checkbox" name="C1" value="ON"><input type="checkbox" name="C1" value="ON">
Konu: HTML DİLİ 