<span> ve <div> etiketleri arasındaki fark nedir?


15

Merak ediyorum, span etiketi div ile aynı şekilde çalışıyor.

Yanıtlar:


22

Temel fark, <span>etiketin satır içi bir öğe olması, <div>etiketin ise blok düzeyinde bir element olmasıdır.

İki blok seviyesi elemanı (div) birbiri ardına dikey olarak gösterilirken, iki satır içi eleman (aralık) yatay olarak birbiri ardına gösterilecektir.

Görsel terimlerdeki farkı anlamak için, <span>öğeyi bir kelime ve <div>öğeyi bir paragraf olarak düşünmek yardımcı olabilir : div'ler genellikle içerik bloklarını yerleştirmek için kullanılır. Açıklıklar normalde bu içerik içindeki kelime gruplarını vurgulamak için kullanılır.


11

Hem Nick hem de Toby sorunuzu güzelce yanıtladı, ancak bir seviye daha ileri götürmek için.

Varsayılan olarak, <div>s blok öğeleridir ve <span>s satır içi öğelerdir. Bunlar, basitçe blok veya satır içi kapsayıcılar sağlayan genel etiketlerdir. Uygulamada, bunlar ekran css özniteliğini 'blok', 'satır içi' ve hatta 'satır içi blok' (diğerlerinin yanı sıra) olarak ayarlayarak CSS üzerinden biraz değiştirilebilir.

Ancak, birbirleri gibi davranmaları için eğilmeleri tavsiye edilmez. HTML'de, diğer öğelerin (çoğunlukla <a>etiket gibi satır içi öğeler ) içinde blok düzeyinde öğeler kullanılmasını gerçekten engelleyen kurallar vardır , bu nedenle uygun etiketi doğru yerde kullanmaya çalışmalı ve yalnızca davranışlarını geçersiz kılmaya çalışmalısınız. kesinlikle gerekli.

Bunları semantik unsurlar olarak düşünmeye çalışın. <span>Örneğin, metin bloklarının içinde kullanılan içeriği etiketlemek istediğinizde kullanın <div>ve sayfanın kendisine fazladan bir yapı eklemeniz gerektiğinde kullanın.

Bunu söyledikten sonra, HTML5, bu genel etiketlerden herhangi birini kullanma gereksinimini önemli ölçüde azaltan çok sayıda semantik öğeye sahiptir. Anlamsal etiketler kullanılması, bol miktarda div ve yayılma eklenmesi konusunda şiddetle tavsiye edilir.

İyi şanslar!


5

Temel fark, divsblok elemanlar ve spanssatır içi elemanlardır.

Her ikisi de istediğiniz gibi hareket etmek için CSS kullanılarak şekillendirilebilir, ancak normalde spansdaha küçük satır içi bölümler ve divsdaha büyük bloklar için kullanırsınız.

Bazı şeyler satır içi ve blok öğelerini farklı etkiler, örneğin bir spanöğeye yükseklik koyamazsınız .


Blok ve satır içi öğeyle ne demek istiyorsun?

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.