SORU
8 EKİM 2008, ÇARŞAMBA


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

Bazı basit örnekler <div> <span> nasıl kullandığını göstermek için sormak istiyorum. Gördüm ikisini de eskiden mark bir bölüm bir sayfa bir id class, ama ilgilendiğim tanırım zamanlar bir tercih mi, yoksa başka.

CEVAP
8 EKİM 2008, ÇARŞAMBA


div eleman span satır içi bir bloktur.

Bu onları anlamsal olarak kullanmak için divs yayılan metin, resim, vb küçük porsiyonlarda sarmak için kullanılması gerekirken belge bölümleri sarmak için kullanılması gerektiğini anlamına gelir.

Örneğin:

<div>This a large main division, with <span>a small bit</span> of spanned text!</div>

Yasadışı bir satır öğesi içinde bir öğe, yani: block düzeyde yer olduğunu unutmayın

<div>Some <span>text that <div>I want</div> to mark</span> up</div>

...yasadışı.

Bazı somut örnekler istedin, bir, 17**: benim bowling internet sitesinden alınmıştır

<div id="header">
    <div id="userbar">
        Hi there, <span class="username">Chris Marasti-Georg</span> |
        <a href="/edit-profile.html">Profile</a> |
        <a href="http://www.bowlsk.com/_ah/logout?...">Sign out</a>
    </div>
    <h1><a href="/">Bowl<span class="sk">SK</span></a></h1>
</div>

Tamam, neler oluyor? Benim sayfanın en üstünde, mantıksal bir bölüm var,"". başlık Bu bir dosya olduğundan, div, uygun kimliği ile kullanıyorum. Bunun içinde bir kaç bölüm kullanıcı çubuğu ve gerçek sayfa Başlığı var. Başlık uygun etiketi, h1 kullanır. Bu userbar, bir bölüm olmak, div bir sarılmış. Bunun içinde kullanıcı adı stilini değiştirebilirim, böylece ** 14, sarılır. Gördüğünüz gibi, aynı zamanda başlık span yaklaşık 2 harf - bu benim kendi rengini değiştirmek için benim stil sağlar sarılmış var.

Ayrıca HTML5 ortak sayfa yapıları, makale, bölüm, nav, vs. olarak tanımlayan öğeleri geniş bir dizi yeni içerdiğini unutmayın. HTML 5 working draft bölüm 4.4 onları listeler ve kendi kullanımı için ipuçları verir. HTML5 hiçbir şey "henüz, ama bu öğelerin herhangi bir yere gidiyor. bu son derece şüphelidir" son yani hala çalışan bir spec, Orada bir javascript kesmek gerekir kullanmak istiyorsanız tarzı bu unsurlar içinde bazı eski sürüm IE - esasında gerek oluşturmak için bir her öğe kullanarak document.createElement daha önce herhangi bu elemanları belirtilen kaynak. Senin için halleder kütüphaneler bir sürü vardır - hızlı bir Google Arama html5shiv çıktı.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • jesiel santos

    jesiel santo

    15 Ocak 2009
  • picster

    picster

    20 NİSAN 2006
  • TastyTuts | Creative video tutorials by Gareth David

    TastyTuts |

    6 Temmuz 2011