HTML Elemanları
HTML elemanları html elementleri olarak da adlandırılır.
Bir başlangıç ve bitiş tagı ve bu iki tag arasındaki herşey bir html elemanıdır. Basit bir elemanın şablonu şöyledir:
<tagadı>içerik</tagadı>
Aşağıda bir paragraf elemanı görüyorsunuz:
<p>Bu bir paragraftır</p>
Bu da bir başlık elemanıdır:
<h2>Bu bir başlıktır</h2>
Bir çok eleman bir araya gelerek html dökümanlarını oluşturur.
Bazı html elemanlarının bitiş tagı yoktur.
İçiçe Geçmiş HTML Elemanları
Aşağıda 4 eleman içeren bir html dökümanı verilmiştir:
<!DOCTYPE html>
<html>
<body>
<h1>bu bir başlıktır</h1>
<p>bu bir paragraftır</p>
</body>
</html>
<html>
<body>
<h1>bu bir başlıktır</h1>
<p>bu bir paragraftır</p>
</body>
</html>
İlk eleman: <html>, tarayıcıya, bir html dökümanının başladığını ilan eder. Dökümanın içerisindeki diğer 3 eleman, <html> ve </html> elemanının alt elemanlarıdır ve bu ikisinin arasına yazılmalıdır.
İkinci eleman: <body> ve </body> taglarının arası bir html sayfasının gövdesidir. Başlıklar, paragraflar, resimler, videolar, menüler gibi bütün sayfa içeriği birer alt eleman olarak, bu iki tag arasına yazılır. <body> elemanı <html> elemanının alt elemanıdır.
Üçüncü eleman: Başlık elemanıdır ve <body> elemanının alt elemanıdır. <h1> tagıyla başlar ve </h1> tagıyla biter.
Dördüncü eleman: Paragraf elemanıdır ve bu da <body> elemanının alt elemanıdır. <p> tagıyla başlar ve </p> tagıyla biter.
Sonuç olarak, yukarıdaki html dökümanı, tarayıcımızda şöyle görünecektir:
bu bir başlıktır
bu bir paragraftırBitiş Taglarını Unutmayalım
Bazı html elemanları bitiş tagları olmadan da düzgün şekilde çalışacaktır.
<html>
<body>
<h1>bu bir başlıktır
<p>bu bir paragraftır
</body>
</html>
<body>
<h1>bu bir başlıktır
<p>bu bir paragraftır
</body>
</html>
Yukarıdaki örnek bütün tarayıcılarda hatasız bir şekilde çalışır. Fakat asla buna güvenmemeliyiz. Bitiş tagları bulunmayan bir html dökümanı beklenmedik sonuçlara veya sayfamızın hata vermesine sebep olabilir.
Bir benzetme:
Taglar iç içe konulmuş kutulara benzetilebilir. Hepsi en büyük kutunun, <html> kutusunun içindedir. Bu kutu bizim sayfamızdır. Hepsinin ağzını kapatmak istiyorsak önce en son koyduğumuz kutuyu, yani en içteki kutuyu(tagi) kapatmalıyız. Bu yüzden en önce <html> tagı açılır, en son yine html tagı kapatılır:</html>HTML kutusunun içine önce, yan yana olacak şekilde <head> ve <body> kutularını koyarız sonra da bu iki kutunun içine başka kutular koyarız. Bazen içi içe bazen de yan yana... <head> kutusunda, yazdığımız sayfa ile ilgili bir takım özellik kutuları, <body> kutusuna da sayfamızın içerik kutularını koyarız.
Unutmayın insanlar sitemize girdiğinde, web tarayıcıları sayfamızdaki <body> kutusunun içindekileri açarak insanlara gösterir! <head> kutusu web tarayıcısına <body> kutusunu nasıl göstereceğine dair bir takım ipuçları verir. Örneğin <body> kutusundakileri insanlara gösterirken Türkçe dilini kullanması gerektiğini web tarayıcısına <head> kutusu söyler.
Boş HTML Elemanları
İçeriği olmayan elemenler boş elemanlar olarak adlandırılır. <br> tagı böyle bir elemandır ve metni bir satır aşağıya atlatmaya yarar.Bu tagı <br /> şeklinde de yazabiliriz. Böylece aynı anda hem açmış hem de kapamış oluruz. <br /> şeklinde yazmak şart olmasa da hazırladığımız html dökümanının XML derleyiceler tarafından okunabilirliğini sağlar.
Büyük/Küçük Harf Duyarlılığı
Html tagları büyük/küçük harf ayrımı yapmazlar. Yani <body> yazmakla <BODY> yazmak veya <Body> veya <boDy> yazmak arasında bir fark yoktur. Fakat html geliştiricileri bütün taglarda küçük harf kullanmamızı önemle tavsiye ederler.
Hiç yorum yok:
Yorum Gönder