HTML NEDİR?
İngilizce’si HyperText Markup Language olan Html web sitesi tasarlamak için kullanılan bir dildir. Asıl amacı sahip olunan
bilgilerin bir dokümana yazılıp bu dokümanların başka kişilerce
okunabilmesini, elde edilebilmesidir.Bu da HyperText (bağlantılı
metinler) ile sağlanıyor.Yani sayfanın içindeki bir linkin olması ve bu
link ile başka sayfalara erişebilmek anlamına geliyor.
TEMEL HTML TAGLARI VE PARAMETRELERİ
SAYFA BASLIĞI
Sayfa içeriği bu bölüme gelir
Bir html sayfasının en sade hali yukarıdaki gibidir. tagı
ile başlar ile biter. tagları
arasına meta tagları cssler javascriptler konulur.
tagları arasına sayfa başlığı yazılır.
tagları arasına sayfada bulunmasını istediğimiz yazı resim
vb içeriği yerleştiririz.
BODY Tagının parametleri
* BGCOLOR Arka plan rengini belirler
* BACKGROUND Arka plana resim ekler
* TEXT Yazı rengini belirler
* LINK Sayfadaki linklerin(bağlantıların) rengini belirler
* ALINK Aktif link rengini belirler
* VLINK Ziyaret edilmiş linklerin rengini belirler
* LEFTMARGIN Sayfanın sol ve sağından ne kadar içeriye doğru kayacağını belirler.
* TOPMARGIN Sayfanın üst kısmından ne kadar içeriye doğru kayacağını belirler.
Örnekler
veya
Arka plan rengini değiştirmek için rengin ingilizce adını (red gibi)
yada hexadecimal kodunu (#FF0000 gibi) girmeliyiz. Dikkat ettiyseniz
hexadecimal kodu girerken kodun başına # işareti ekliyoruz Eğer kod
kullanacaksak bu işareti kullanmalıyız yoksa yanlış olur.
Artalan resim eklemek için bu komutu kullanırız " " iki tırnak işareti
arasına resmin bulundugu yeri ,resmin adını ve resmin uzantısını yazarız
"banner.JPG" örneğinde banner resmin adı JPG ise resmin uzantısı (türü)
resim eğer html belgemiz ile aynı klasörde ise yolu yazmıyoruz
Eğer banner adlı resmimiz resimler klasörü altında ise şeklinde belirtiyoruz.
yazı rengini sarı yaptık
linkler mavi aktif link kırmızı ziyaret edilmiş linkler mor oldu.
sayfa içeriği kenara yapışık olmadı belirttiğimiz miktarda içeriye kaydı.
META (TANIMLAMA) TAGLARI
* kodu ı,ğ,ş,ç gibi türkçe karakterlerin düzgün
çıkması için browsera sayfanın türkçe oldugunu söyler
*
Kodu sayfanın tasarımcı kimliğini gösterir
*
Kodu sayfanın telif hakkının kime ait olduğunu gösterir.
*
Kodu sayfanın hangi kelimeleri içerdiğini
gösterir.Bu kod arama motorlarında sitenizin adının geçmesi için çok
önemlidir.
*
Kodu sayfanın kısa tanımı yapılmak için kullanılır
*
Kodu sayfanın hangi editörle yapıldığını gösterir
*
Kodu sayfanızı tüm
arama motorlarının veri tabanına kaydolabilme hakkının verilmiş
olduğunu gösterir.
*
Kodu sitenizin hangi
kategoride, sınıfta olduğunu gösterir. GENERAL yazmakla bütün katagoride
olduğu belirtilmiş oldu.
*
content="3RL=http://www.ahmetozdemir.com.tr.tc"> Sayfa açıldıktan 3
saniye sonra belirtilen url’ye gider url’yi aynı sayfa olarak
belirtirsek sayfayı 3 saniyede bir yenilemiş oluruz.
YAZI YAZMAK VE BİÇİMLENDİRMEK
* yazacağımız yazı
bu iki tag arasında kalan yazı belirtilen özellikleri alır
size büyüklük color yazı rengi face yazı tipini belirler.
* yazacağımız yazı iki tag arasında kalan
yazının büyüklüğünü belirler size ile aynı görevdedir & işareti
yerine 1 den 6 ya kadar olan rakamlar gelebilir rakam büyüdükçe yazı
boyutu küçülür
* yazacağımız yazı yazıyı satırın ortasına taşır.
*
*
*
ortasına taşır tagı ile aynı görevdedir
*
yazıyı bir alt satırdan devam ettirmek için
tagını kullanırız normal yazı yazar gibi enter ile alt satıra insek bile
html belgemizdeki yazı aynı satırda olacaktır bunun için alt satıra
geçmek istiyorsak bu etiketi kullanmalıyız
*
tagının bitiş tagı yoktur diğer tüm tagların başlangıç ve bitiş tagları bulunur.
* yazacağımız yazı iki tag arasındaki yazı altı çizgili olur
* yazacağımız yazı iki tag arasındaki yazı italik olur
* yazacağımız yazı iki tag arasındaki yazı kalın olur
*yazağımız yazı yazacağımız metnin tek
satırda olmasını istersek bu tagı kullanırız eğer kullanmazsak uzun olan
metnimiz sayfanın sonuna gelince otomatik olarak alt satırdan devam
eder
*
satıra geçersek ve bu tagı kullanırsak html belgemizdede alt satırda
olur tıpkısının aynısı yani
*
* Yanyana iki hücreyi birleştirmek
yanyana iki hücreyi birleştirmek için colspan komutunu
kullanırız birleştireceğimiz hücrenin içerisine bu
komutu ekleriz.
Ekran çıktısı şu şekilde olur
bir
iki
üç
dört
beş
altı
yedi
sekiz
* Altalta iki hücreyi birleştirmek
Altalta iki hücreyi birleştirmek için rowspan komutunu
kullanırız birleştirmek istediğimiz hücrenin
içerisine bu komutu yerleştiririz.
Ekran çıktısı şu şekilde olur
bir
iki
üç
dört
beş
altı
yedi
sekiz
FRAMELER (ÇERCEVELER)
* Frame özelliğini birden fazla sayfayı belirli oranlarda tek sayfada birleştirmek için kullanacağız.
* Sonuç olarak ortaya yeni bir sayfa çıkacağı
için frame kodlarını temel html tagları olan (bOdy tagı
hariç[Resimleri görebilmek için üye olun veya giriş yapın.] bir sayfaya yerleştireceğiz.
* tagları arasına oluşturacağımız sayfaların parçaları girilir
* frame ile sayfa ekleriz name
adını belirler cerceveye link vermek için önemlidir
linkler bölümünde
görmüştük src ise sayfanın bulundugu yeri
sayfanın adını uzantısını belirtir">cols yatay birleştirme oranını
rows ise dikey birleştirme oranını belirler
* frameborder kenar kalınlığının olup olmayacağını belirler
frameborder="yes| no" yes olursa kenar kalınlığı olur , no olursa kenar
kalınlığı olmaz.
* border="3" kenar kalınlığını belirler
* bordercolor="red" kenar kalınlığının rengini belirler
* scrolling kaydırma çubuğunun olup olmayacağını belirler
scrolling="yes" kaydırma çubuğu olur , scrolling="no" kaydırma
çubuğu olmaz ,scrolling="auto" gerekirse kaydırma
çubuğu olur
* marginwidth yatay kenar boşluğunu marginheight üstteki kenar boşluğunu belirler.
* frame özelliği htmlye
sonradan eklendiği için eski browserlar bu teknolojiyi
desteklemez ziyaretçinize bu tag ile bilgi verirsiniz.
* Frame konusu biraz karışık gelebilir bu konuda fazlaca deneme yapınız
Çerçeveli sayfa
İngilizce’si HyperText Markup Language olan Html web sitesi tasarlamak için kullanılan bir dildir. Asıl amacı sahip olunan
bilgilerin bir dokümana yazılıp bu dokümanların başka kişilerce
okunabilmesini, elde edilebilmesidir.Bu da HyperText (bağlantılı
metinler) ile sağlanıyor.Yani sayfanın içindeki bir linkin olması ve bu
link ile başka sayfalara erişebilmek anlamına geliyor.
TEMEL HTML TAGLARI VE PARAMETRELERİ
Sayfa içeriği bu bölüme gelir
Bir html sayfasının en sade hali yukarıdaki gibidir. tagı
ile başlar ile biter. tagları
arasına meta tagları cssler javascriptler konulur.
tagları arasına sayfada bulunmasını istediğimiz yazı resim
vb içeriği yerleştiririz.
BODY Tagının parametleri
* BGCOLOR Arka plan rengini belirler
* BACKGROUND Arka plana resim ekler
* TEXT Yazı rengini belirler
* LINK Sayfadaki linklerin(bağlantıların) rengini belirler
* ALINK Aktif link rengini belirler
* VLINK Ziyaret edilmiş linklerin rengini belirler
* LEFTMARGIN Sayfanın sol ve sağından ne kadar içeriye doğru kayacağını belirler.
* TOPMARGIN Sayfanın üst kısmından ne kadar içeriye doğru kayacağını belirler.
Örnekler
veya
Arka plan rengini değiştirmek için rengin ingilizce adını (red gibi)
yada hexadecimal kodunu (#FF0000 gibi) girmeliyiz. Dikkat ettiyseniz
hexadecimal kodu girerken kodun başına # işareti ekliyoruz Eğer kod
kullanacaksak bu işareti kullanmalıyız yoksa yanlış olur.
Artalan resim eklemek için bu komutu kullanırız " " iki tırnak işareti
arasına resmin bulundugu yeri ,resmin adını ve resmin uzantısını yazarız
"banner.JPG" örneğinde banner resmin adı JPG ise resmin uzantısı (türü)
resim eğer html belgemiz ile aynı klasörde ise yolu yazmıyoruz
Eğer banner adlı resmimiz resimler klasörü altında ise şeklinde belirtiyoruz.
yazı rengini sarı yaptık
linkler mavi aktif link kırmızı ziyaret edilmiş linkler mor oldu.
sayfa içeriği kenara yapışık olmadı belirttiğimiz miktarda içeriye kaydı.
META (TANIMLAMA) TAGLARI
* kodu ı,ğ,ş,ç gibi türkçe karakterlerin düzgün
çıkması için browsera sayfanın türkçe oldugunu söyler
*
Kodu sayfanın tasarımcı kimliğini gösterir
*
Kodu sayfanın telif hakkının kime ait olduğunu gösterir.
*
Kodu sayfanın hangi kelimeleri içerdiğini
gösterir.Bu kod arama motorlarında sitenizin adının geçmesi için çok
önemlidir.
*
Kodu sayfanın kısa tanımı yapılmak için kullanılır
*
Kodu sayfanın hangi editörle yapıldığını gösterir
*
Kodu sayfanızı tüm
arama motorlarının veri tabanına kaydolabilme hakkının verilmiş
olduğunu gösterir.
*
Kodu sitenizin hangi
kategoride, sınıfta olduğunu gösterir. GENERAL yazmakla bütün katagoride
olduğu belirtilmiş oldu.
*
content="3RL=http://www.ahmetozdemir.com.tr.tc"> Sayfa açıldıktan 3
saniye sonra belirtilen url’ye gider url’yi aynı sayfa olarak
belirtirsek sayfayı 3 saniyede bir yenilemiş oluruz.
YAZI YAZMAK VE BİÇİMLENDİRMEK
* yazacağımız yazı
bu iki tag arasında kalan yazı belirtilen özellikleri alır
size büyüklük color yazı rengi face yazı tipini belirler.
*
yazının büyüklüğünü belirler size ile aynı görevdedir & işareti
yerine 1 den 6 ya kadar olan rakamlar gelebilir rakam büyüdükçe yazı
boyutu küçülür
*
*
yazacağımız yazı
yazıyı satırın soluna taşır.*
yazacağımız yazı
yazıyı satırın sağına taşır.*
yazacağımız yazı
yazıyı satırınortasına taşır
*
yazıyı bir alt satırdan devam ettirmek için
tagını kullanırız normal yazı yazar gibi enter ile alt satıra insek bile
html belgemizdeki yazı aynı satırda olacaktır bunun için alt satıra
geçmek istiyorsak bu etiketi kullanmalıyız
*
bu tag’a 2*br diyebiliriz 2 satır alttan devam etmek için
bunu kullanırız ayrıca pragraf yapmak içinde bu tagı kullanırız
* NOT:
,
ve
tagının bitiş tagı yoktur diğer tüm tagların başlangıç ve bitiş tagları bulunur.
* yazacağımız yazı iki tag arasındaki yazı altı çizgili olur
* yazacağımız yazı iki tag arasındaki yazı italik olur
* yazacağımız yazı iki tag arasındaki yazı kalın olur
*
satırda olmasını istersek bu tagı kullanırız eğer kullanmazsak uzun olan
metnimiz sayfanın sonuna gelince otomatik olarak alt satırdan devam
eder
*
bu iki tag arasındaki yazı aynen çıkar yani enterla alt
YA Z A CAĞ I MI Z YAZ I
satıra geçersek ve bu tagı kullanırsak html belgemizdede alt satırda
olur tıpkısının aynısı yani
*
Tablodaki hücreleri yatay ve dikey birleştirmek
yazağımız yazı
bu iki tag arasına yazılan yazı sayfanın hem sağından hemde solundan bir miktar içeri kayar
* yazacağımız yazı iki tag arasındaki yazı satırın birazcık üzeride görünür.
* yazacağımız yazı iki tag arasındaki yazı satırın birazcık altında görünür.
*yazacağımız yazıiki tag arasındaki yazı üstü çizili olur
* yazacağımız yazı vurguyu belirtmek için kullanılır dışarıya biraz eğik çıkar
* yazacağımız yazı güçlü vurguyu belirtir dışarıya biraz koyu çıkar
*yazacağımız yazı
yasa kural belirten yazılar için kullanılır
* yazacağımız yazı
* yazacağımız yazı tam emin olmadığımız yazılar için kullanılır.
* yazacağımız yazı tanımlama belirten yazılar için kullanılır.
* yazcağımız yazı alıntı olan yazıyı belirtmek için kullanılır.
* yazacağımız yazı bu iki tag arasındaki yazı dışarıya çok küçük çıkar.
* yazacağımız yazı bu iki tag arasına yazılan yazı dışarıya çok büyük çıkar.
*yazağımız yazı bu iki tag adres belirtmek için kullanılır.
* yazacağımız yazı bu iki tag arasına yazacağımız yazı keyboard karakterleri gibi görünür.
* yazacağımız yazı bu iki tag arasına yazılan yazı daktilo yazısı gibi olur.
*yazacağımız yazı
yazının satırın neresinde görünmesini bu tag ile belirleriz left | center | right > ile aynı görevdedir
*
bu tag çizgi çizdirmeye
yarar width yatay uzunluğu color rengi size dikey uzunluğu belirler.
* left scrolldelay="100" scrollamount="30" width="400" height="15"
behavior="alternate" >
yazıcağımız yazı veya ekleyeceğimiz resim bölümü
bgcolor kayan bölgenin arka plan rengini belirler ,
loop kaç kez kayacağını belirler bunu kullanmazsak sonsuza kadar kayar ,
direction kayma yönünü belirler up yukarı down aşağı left sola right
sağa , scrolldelay kayma hızını belirler sayı arttıkça hız düşer
scrollamount zıplayarak gitme hızını belirler sayı arttıkça hız artar
,width kayan bölgenin genişliğini height ise kayan bölgenin yüksekliğini
belirler.
* bu tag kodların düzenli olabilmesi için kullanılır örneğin
yazdıgımız kodlar ne işe yarar not düşeriz bu tag ile ve sayfada
görünmez.
* Yanyana iki hücreyi birleştirmek
yanyana iki hücreyi birleştirmek için colspan komutunu
kullanırız birleştireceğimiz hücrenin içerisine bu
komutu ekleriz.
bir | iki | üç |
dört | beş | |
altı | yedi | sekiz |
Ekran çıktısı şu şekilde olur
bir
iki
üç
dört
beş
altı
yedi
sekiz
* Altalta iki hücreyi birleştirmek
Altalta iki hücreyi birleştirmek için rowspan komutunu
kullanırız birleştirmek istediğimiz hücrenin
içerisine bu komutu yerleştiririz.
bir | iki | üç |
dört | beş | altı |
yedi | sekiz |
Ekran çıktısı şu şekilde olur
bir
iki
üç
dört
beş
altı
yedi
sekiz
FRAMELER (ÇERCEVELER)
* Frame özelliğini birden fazla sayfayı belirli oranlarda tek sayfada birleştirmek için kullanacağız.
* Sonuç olarak ortaya yeni bir sayfa çıkacağı
için frame kodlarını temel html tagları olan (bOdy tagı
hariç[Resimleri görebilmek için üye olun veya giriş yapın.] bir sayfaya yerleştireceğiz.
* tagları arasına oluşturacağımız sayfaların parçaları girilir
* frame ile sayfa ekleriz name
adını belirler cerceveye link vermek için önemlidir
linkler bölümünde
görmüştük src ise sayfanın bulundugu yeri
sayfanın adını uzantısını belirtir">cols yatay birleştirme oranını
rows ise dikey birleştirme oranını belirler
* frameborder kenar kalınlığının olup olmayacağını belirler
frameborder="yes| no" yes olursa kenar kalınlığı olur , no olursa kenar
kalınlığı olmaz.
* border="3" kenar kalınlığını belirler
* bordercolor="red" kenar kalınlığının rengini belirler
* scrolling kaydırma çubuğunun olup olmayacağını belirler
scrolling="yes" kaydırma çubuğu olur , scrolling="no" kaydırma
çubuğu olmaz ,scrolling="auto" gerekirse kaydırma
çubuğu olur
* marginwidth yatay kenar boşluğunu marginheight üstteki kenar boşluğunu belirler.
*
sonradan eklendiği için eski browserlar bu teknolojiyi
desteklemez ziyaretçinize bu tag ile bilgi verirsiniz.
* Frame konusu biraz karışık gelebilir bu konuda fazlaca deneme yapınız