Bu bölümde bazı temel HTML örneklerini göstereceğiz.
Henüz eğitimlerde anlatılmayan kodları kullanabiliriz. İleride bunlarla ilgili detaylı açıklamaları aktarmaya çalışacağım.
HTML Belgeleri
Tüm HTML belgeleri bir belge türü bildirimiyle başlamalıdır. HTML belge türü de <!DOCTYPE html> şeklindedir
HTML <html> ile başlar ve </html> ile biter.
HTML belgesinin tarayıcıda görünecek kısmı <body> ile </body> arasındadır.
<!DOCTYPE html>
<html>
<body>
<h1>İlk Başlık</h1>
<p>İlk paragraf girişi.</p>
</body>
</html>
<!DOCTYPE> Tanımlama
<!DOCTYPE> bildirimi belge türünü temsil eder ve tarayıcıların web sayfalarını doğru görüntülemesine yardımcı olur.
Sayfanın üst kısmında (herhangi bir HTML etiketinden önce) yalnızca bir kez görünmelidir.
<!DOCTYPE> bildirimi büyük/küçük harfe duyarlı değildir.
HTML5 için <!DOCTYPE> aşağıdaki şekilde tanımlanır:
<!DOCTYPE html>HTML Başlıkları
HTML’de başlıklar <h1> ile <h6> etiketleriyle tanımlanır. <h1> en önemli başlığı <h6> ise alt başlıkları ve önem değeri düşük başlıkları tanımlar.
<h1>Başlık 1</h1>
<h2>Başlık 2</h2>
<h3>Başlık 3</h3>
<h4>Başlık 4</h4>
<h5>Başlık 5</h5>
<h6>Başlık 6</h6>
HTML Paragrafları
HTML dilinde paragraflar <p> etiketiyle tanımlanır.
<p>Bu bir paragraf.</p>
<p>Bu başka bir paragraf.</p>
HTML Linkler
HTML dilinde linkler <a> etiketiyle tanımlanır.
<a href="https://www.turkyazilimci.com">Yazılım Eğitim Sitesi</a>
Linke tıklayınca www.TurkYazilimci.com sitesi açılacaktır.
Bağlantının hedefi href özelliğinde belirtilir.
Nitelikler, HTML öğeleri hakkında ek bilgi sağlamak için kullanılır.
Nitelikler hakkında daha sonraki bir bölümde daha fazla bilgi edineceksiniz.
HTML Görseller
HTML görselleri <img> etiketiyle tanımlanır.
Kaynak dosya (src), alternatif metin (alt), genişlik ve yükseklik özellikler olarak sağlanır:
<img src="turkYazilimciLogo.png" alt="turkyazilimci.com" width="104" height="142">
Sitenin HTML Kaynak Kodu Nasıl Görüntülenir?
Bir çoğumuz bir web sitesine girip “Acaba bu siteyi nasıl yaptılar?” diye merak etmişizdir.
HTML Sayfanın Kaynak Kodunu Görüntüleme
HTML kaynak kodunu görüntüleme için bir web sitesine sağ tıklayın ve sayfa kaynağını görüntüle seçeneğini seçin. Karşınıza html kaynak kodunu içeren bir sayfa çıkacaktır. HTML kodunu burada görebilirsiniz.
HTML Ögesini İnceleme
herhangi bir ögeye veya boş bir alana sağ tıklayarak ögeyi denetle veya incele seçeneğine tıklayın. Sayfaya veya ögeye ait hem HTML hem CSS kodunu görebilirsiniz.
