HTML Temel : HTML Bloklar Ve Div Kullanımı

  Html, Webmaster    27 Ocak 2019
Yorum Yok

Html bloklar genel olarak kullanılan div etiketi ve span etiketileridir. Tüm HTML öğeleri iki kategoride sınıflandırılabilir (a) Blok Seviyesi Öğeleri (b) Satır İçi Öğeleri.

Blok Elemanları

Blok elemanları ekranda sanki önce ve sonra bir satır kesmesi varmış gibi görünür. Örneğin, <p>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <ul>, <ol>, <dl>, <pre>, <hr. />, <blockquote> ve <address> öğelerinin tümü blok düzeyinde öğelerdir. Hepsi kendi yeni çizgisinde başlarlar ve onları takip eden her şey kendi yeni çizgisinde görünür.

Satır İçi Elemanları

Diğer yandan, satır içi öğeler, cümleler içinde görünebilir ve kendi başlarına yeni bir satırda görünmeleri gerekmez. <b>, <i>, <u>, <em>, <strong>, <sup>, <sub>, <big>, <small>, <li>, <ins>, <del>, < code>, <cite>, <dfn>, <kbd> ve <var> öğelerinin tümü satır içi öğelerdir.

HTML Öğelerini Gruplandırma

Çeşitli diğer HTML etiketlerini gruplamak için çok sık kullandığımız iki önemli etiket vardır (i) <div> etiketi ve (ii) <span> etiketi

<div> etiketi

Bu, diğer HTML etiketlerinin gruplandırılmasında ve CSS elemanlarının grubuna uygulanmasında büyük rol oynayan blok seviye etiketidir. Şimdi bile <div> etiketi, <div> etiketini kullanarak sayfanın farklı bölümlerini (Sol, Sağ, Üst vb.) Tanımladığımız web sayfası düzeni oluşturmak için kullanılabilir. Bu etiket blokta herhangi bir görsel değişiklik sağlamaz, ancak bunun CSS ile kullanıldığında daha fazla anlamı vardır.

Örnek

Aşağıda <div> etiketinin basit bir örneği verilmiştir. Basamaklı Stil Sayfasını (CSS) ayrı bir bölümde öğreneceğiz ancak burada <div> etiketinin kullanımını göstermek için kullandık –


<span> etiketi

HTML <span> bir satır içi öğedir ve bir HTML belgesindeki satır içi öğeleri gruplandırmak için kullanılabilir. Bu etiket aynı zamanda blokta herhangi bir görsel değişiklik sağlamaz, ancak CSS ile kullanıldığında daha fazla anlamı vardır.

<span> etiketi ile <div> etiketi arasındaki fark, <span> etiketinin satır içi öğelerle birlikte kullanılması, <div> etiketinin blok düzeyinde öğelerle kullanılmasıdır.

Örnek

Aşağıda, <span> etiketinin basit bir örneği verilmiştir. Basamaklı Stil Sayfasını (CSS) ayrı bir bölümde öğreneceğiz ancak burada <span> etiketinin kullanımını göstermek için kullandık –

Kodun sonucunda :

Bu renk kırmızı ve bu renk ise yeşil

 

0 okunma

Etiketler : , , , , ,

  Benzer Yazılar


  Yorumlar

Bir Cevap Yazın

E-posta hesabınız yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Bu yazıya henüz yorum yapılmamıştır, yazı hakkındaki düşüncelerinizi paylaşmaktan çekinmeyin.