Gönderen Konu: html. e-kitap (Okunma sayısı 1229 defa)

by_brk

HTML > 1-Hadi başlayalım (HTML , HEAD)
Yazmaya başlamadan önce bir editöre ihtiyacımız var. Bu da windows NotePad tir. Şimdi bilgisayarımızda "webTasarım Ders örnekleri" adlı bir dizin açarak işimize başlayalım.

Bir HTML belgesinin genel bir hali ;
<HTML>
<HEAD>
... ( Baş Kısım )
</HEAD>
<BODY>
... ( Gövde kısım , Esas Komutlar)
</BODY>
</HTML>
<HTML>
Kullanılışı : Başlangıcı <html> , Bitişi : </html>
Amacı : Bir web sayfasında bulunması gereken zorunlu bir komuttur. Başlangıcı ifade eden komut dosyanın en başına yazılır. Bitişi belirten komut ise en sona.

Şimdi windows not defterini açalım ve en başına <html> yazalım. Daha sonra adınızı yazın.Bunun ardından </html> yazıp bu dosyayı açtığınız "webTasarım Ders örnekleri" dizinine index.html olarak kaydedin.(Kaydedilecek dosya adı yerine aynen index.html yazarak bunu yapabilirsiniz.) Şimdi de bu dosyanın üzerine gelerek tıklayın. işte olan oldu ve bir web sayfacığı yaptınız.

<HEAD>
Kullanılışı : Başlangıcı <head> , Bitişi : </head>
Amacı : İllaki olması şart değildir. Genel de META komutu ile beraber kullanılır. O sayfada kullanılışı görülebilir.
HTML > 2 - Başlık ve Nasıl Bulunacağım ( TITLE - META )
<TITLE>

Kullanılışı : <title> BAŞLIK </title>
Daha önce index.html dosyası yapmıştık. Şİmdi bu dosyaya çift tıklayarak bir browser da açılmasını sağlayalım.(Evet , hala bıraktığımız gibi adımız yazıyor.)Bu sayfa da boş bir alanda sağ tıklayın. Gelen menüde "KAYNAĞI GÖRÜNTÜLE" kısmına basalım. Daha önce yazdığımız index.html dosyasının içeriği karşımızda olacak.Bu dosyayı aşağıda soldaki gibi değiştirip kaydedelim. Sonra sayfayı tekrar açalım.(ya da F5 tuşuna basarak yenileyelim) ;

<META>

Kullanılışı : <meta name="description" content="bilgiler">
<meta name="keywords" content="bilgiler">
<meta name="author" content="bilgiler">
<head> ve </head> arasında bu üçlü yazılır.

name="description" olan kısmın content bloğuna sayfada neler bulunduğuna dair bilgiler yazılır. Sayfanızın reklam bölümüdür.

name="keywords" olan kısmın content bloğunda sayfanın içeriğine dair anahtar kelime bulunur. Bu kelime arama motorlarında arama işleminde yazılan kelimedir. Bilgisayar ile ilgili bir siteniz varsa o zaman buraya bilgisayar yazabilirsiniz. Aralarına virgül (,) koymak suretiyle birden fazla kelimeler koyabilirsiniz.
HTML > 3 - Sayfa Planı ( BODY )
<BODY>

Kullanılışı : Başlangıcı <body> , Bitişi : </body>
Head bölümünden hemen sonra <body> ile başlar ve </html> komutundan hemen önce </body> komutu ile kapatılır.

Amacı : Sayfa arka planı düzenlemesi , bazı genellemeler yapmak için kullanılır.

Parametreleri : Parametrelerin kullanımı şu şekildedir.
<body bgcolor="renk" text="renk" link="renk" hlink="renk" vlink="renk" leftmargin=sayi topmargin=sayi marginwidth=sayi marginheight=sayi>
Text=renk Rengi belirlenmeyen yazıların rengini ayarlamak için kullanılır. Renkler ingilizce veya hex decimal kod ile yazılır.
Link=renk Sayfadaki linklerin renklerini belirtmek için kullanılır.
hlink=renk Fare ile linkin üzerine gelince linkin alacağı rengi belirler.
vlink=renk Sayfanızda daha önce uğranmış olan linklerin alacağı rengi belirler.
topmargin=sayı Microsoft Internet Explorer browser ı için kullanılır. Sayfa içeriğinin yukarıdan kaç pixel(birim nokta) aşağıdan başlayacağını belirtir. Örneğin sayı kısmı 10 ise o zaman yukarıdan 10 pixel boş kalır.
leftmargin=sayı Microsoft Internet Explorer browser ı için geçerlidir. Sayfa içeriğinin soldan kaç pixel sağda başlayacağını belirtir. Sayı yazan yer 10 olursa o zaman soldan 10 birim sağda başlar.
marginheight=sayı Netscape Navigator browser ı için geçerlidir. Sayfa içeriğinin yukarıdan kaç pixel aşağıda başlayacağını belirtir.
marginwidth=sayı Netscape Navigator browser ı için geçerlidir. Sayfa içeriğinin soldan kaç pixel sağda başlayacağını belirtir.

örnek : Kod ve sonuçları ;
<html>
<head>
<title>Ege Matematik </title>
<meta name="description" content="sayfanın içeriği">
<meta name="keywords" content="Anahtar kelimeler">
<meta name="author" content="mehmeT kurT">
</head>
<body bgcolor=yellow text=green leftmargin=25 topmargin=25>
Arka plan sarı , yazı ise yeşil , yazı yukarıdan 25 pixel aşağıda
</body>
</html>


 , : YAZI ÖZELLİKLERİNİ AYARLAMA
• Bu komut yazacağımız yazılara özel olarak bir renk vermek , yazıyı istediğimiz bir font tipinde yazdırmak , büyüklüğünü ayarlamak için kullanılır.
Kullanılışı : ... bu özellikte yazılacak yazı ... 
Bu özelliklerde yazılmasını istediğimiz yazı bittiğinde sonuna koyarız.
SIZE : Yazının büyüklüğünü belirtir ve 1 - 6 arasıdır.
• FACE : Yazının font tipini belirler. İlgili tipin ismi yazılır. Eğer yazdığımız font
ismi sayfaya bağlanan kişinin windows > fonts klasöründe yoksa
doğru görüntülenmeyecektir.
COLOR : Yazının rengini belirler. Rengin ingilizcesi ya da kodu belirtilir.
<HTML>
<head>
<title> Sayfa yavaş yavaş oluşmaya başladı !</title>
<meta name="description" content="Bu sayfada matematik ve bilgisayar ile bilgiler vardır.">
<meta name="keywords" content="matematik , bilgisayar , mathematics , computer">
<meta name="author" content="mathWEBteam">
</head>
<body bgcolor=lightblue leftmargin=15 topmargin=15 marginwidth=15 marginheight=15 text=black>
Bu yazı 2 büyüklüğünde ve mavidir.
Bu yazı ise FONT özelliklerinin dışında kaldığından BODY komutu gereği bu yazı beyazdır. Bu yazı ise yeşil renkte ve 4 büyüklüğündedir. Ayrıca tipi de tahoma dır.
</body>
</HTML>