HTML rel etiketi

Question

HTML5 belgesini w3c ile doğrulamaya çalışıyorum. Basit ışık kutuları ve resim galerileri için fancybox jQuery eklentisini kullanıyorum. Her bir resim galerisi arasında ayrım yapmak için rel etiketini kullanıyorum.

ben aşağıdaki hatayı alıyorum sayfamı doğrulamak:

İşte

Bad value gallery for attribute rel on element a: Not an absolute IRI. The string gallery is not a registered keyword or absolute URL.

kodum edilir:

<div class="portItem"> 
    <div class="thumbs"> 
     <div class="items"> 
     <img src="images/rsl.jpg" class="col" alt="A website for R.S.Lynch and Company"/> 
     <div class="caption"> 
      <a class="fancybox" rel="gallery1" href="images/rs1.jpg">R.S.Lynch & Company</a> 
      <div class="hidden"> 
      <a class="fancybox" rel="gallery1" href="images/rs2.jpg"></a> 
      <a class="fancybox" rel="gallery1" href="images/rs3.jpg"></a> 
      <a class="fancybox" rel="gallery1" href="images/rs4.jpg"></a> 
      <a class="fancybox" rel="gallery1" href="images/rs5.jpg"></a> 
      </div> 
     </div> 
     </div> 
    </div> 
</div> 

kullanabilir ve aynı sonucu elde etmek için daha iyi bir etiket var mı? Teşekkür

yerine her galeri için bir sınıf ekleyebilirsiniz

Answer 1

Ben -ailesi burada özniteliği data kullanarak öneririm:

<a class="fancybox" data-gallery="1" href="images/rs1.jpg">R.S.Lynch & Company</a> 
<a class="fancybox" data-gallery="1" href="images/rs2.jpg">...</a> 
<a class="fancybox" data-gallery="1" href="images/rs3.jpg">...</a> 
<a class="fancybox" data-gallery="1" href="images/rs4.jpg">...</a> 
<a class="fancybox" data-gallery="1" href="images/rs5.jpg">...</a> 

... özelliğinin bu tip olduğu gibi DOM öğelerine bazı veriler eklemek için özel olarak tasarlanmıştır. Benim düşünceme göre, class kullanmasından daha semantik.

Bu değerlere $('some selector').data('gallery') sözdizimiyle kolayca erişebilirsiniz.

rel özniteliğine gelince, HTML5'te öntanımlı attributes kümesiyle sınırlı ve belgeler arasında daha yüksek düzeyli ilişkileri tanımlamak için kullanılır.

Answer 2

: Bu gibi class="fancybox gallery1"

Answer 3

<a class="fancybox" data-gallery="1" href="images/img1.jpg">...</a> 
<a class="fancybox" data-gallery="1" href="images/img2.jpg">...</a> 

$ ("fancybox.") Özn ('rel', 'veri galeri') fancybox()..;