HTML span etiketi

HTML etiketlerinden biri olan <span> etiketi div etiketinden farklı olarak bir satır içi elementtir. Bu yüzden span etiketi bir metin içerisinde kullanıldığında metin alt satıra geçmez, aynı satırdan devam eder.

span etiketi ile bir metin içinde spesifik bir kısma CSS verebiliriz.

span etiketi kullanımı

Aşağıdaki örnekte p etiketi içerisinde yer alan metnin “Lorem ipsum” kısmı span etiketi içerisine alınıp stil verilmiştir. Aksi halde p etiketine stil verdiğimizde tüm metin kırmızı renk olacaktır.

<p> <span style="color:red;">Lorem ipsum</span> dolor sit amet,iriure fabellas per ad, alterum meliore ei mel. </p>

Lorem ipsum dolor sit amet,iriure fabellas per ad, alterum meliore ei mel.

div ve span etiketi farkı

Aşağıdaki örneklerde görüldüğü gibi div etiketi block elementi olduğu için aşağı satıra geçmiştir.

span etiketi ise satır içi elementi (inline-block elementi) olduğu için iki metin yan yana yazılmış, alt satıra geçmemiştir.

<div>Örnek Metin</div> 
<div>Örnek Metin</div>
Örnek Metin
Örnek Metin
<span>Örnek Metin</span> 
<span>Örnek Metin</span>
Örnek Metin Örnek Metin
415 Views
29310cookie-checkHTML span etiketi

Leave a Reply

Your email address will not be published. Required fields are marked *