2009-09-15 8 views
0

J'ai besoin de votre suggestion dans le scénario suivant. Disons que j'ai une chose UI commestandard Xhtml- div vs li

Col1 Col2 
A D 
B E 
C F 

Maintenant, pour obtenir ce moment dans mon HTML J'utilise ..like

<div class="col1"> 
    <div>A</div> 
    <div>B</div> 
    .......... 
</div> 
<div class="col2"> 
    <div>D</div> 
    <div>E</div> 
    .......... 
</div> 

Mais ici, je me sers div..is trop il OK selon XHTML standard ou devrais-je utiliser <li>?

Quelqu'un peut-il suggérer avec une explication appropriée, ou peut-être autre chose? Note: Aucune utilisation du tableau Merci.

+2

Comme la plupart des réponses, mon premier instinct a été qu'il ressemble à des données tabulaires et devrait être dans un tableau. Mais la sémantique correcte dépend de ce que sont réellement Col1, Col2, A, B, C etc. Pourriez-vous donner un exemple plus réaliste? – Alohci

Répondre

4

Il me semble que vous essayez d'afficher des données tabulaires dont l'élément table fonctionne très bien et est l'utilisation prévue.

<table> 
    <tr> 
    <th>Col1</th> 
    <th>Col2</th> 
    </tr> 
    <tr> 
    <td>A</td> 
    <td>B</td> 
    </tr> 
</table> 

Si vous ne voulez vraiment pas utiliser table, j'utiliser l'élément div comme vous l'avez fait dans votre exemple. Mais à la fin vous réaliserez que ce que vous essayez d'accomplir est de simuler un élément qui existe déjà - table. Vous devez garder à l'esprit que lorsque vous utilisez div comme une table, il ne sera pas très bien lorsque vous désactivez CSS ou l'afficher avec un ancien navigateur mobile (qui ne supporte pas bien les flotteurs).

+0

Désolé de ne pas utiliser les tables – Wondering

+0

pourquoi ne pas utiliser les tables? – Razzie

+0

Non, selon les normes, je dois créer un format tabulaire en utilisant les tables d'utilisation de divs.cant. – Wondering

0

Vous pourriez peut-être utiliser un definition list, bien que ce soit plus approprié pour les données de paires clé/valeur, bien que cela puisse être le cas dans votre situation, je ne sais pas.

Sinon, comme le dit Manticore, il suffit d'utiliser les tables: http://giveupandusetables.com/

0

Je seconderait la déclaration de Manticore. Les tables doivent également être utilisées pour les données tabulaires (données affichées avec des lignes et des colonnes). Tout le monde se lève sur son cheval à propos de l'utilisation de divs pour la mise en page au lieu de tables, mais cela ne signifie pas que les tables doivent être abandonnées. Ce que vous faites n'est PAS une mise en page; il structure un segment particulier de contenu, et vous devez donc utiliser une balise de table. De plus, certains avantages:

  • Vous pouvez utiliser autour des s qui contiennent des balises pour créer un en-tête de table. Si l'utilisateur imprime la table et qu'elle s'étend au-delà d'une page, le contenu de la table sera imprimé en haut de chaque nouvelle page. La même chose est également vraie de l'étiquette. Une légère différence avec le bien: Contenu à l'intérieur devrait être dans le format de contenu de la cellule 1 - ne pas utiliser le tag à l'intérieur de s à l'exception de ceux dans le.
  • Les divisions sont pratiquement impossibles à mettre en page dans un format de tableau. Ils sont utiles pour la mise en page de la mise en page, mais pas nécessairement pour les données tabulaires. De plus, si vous créez une page interactive dans laquelle l'utilisateur ajoutera plus de données, vous aurez du mal à déterminer quels sont les emplacements des divs.
0

La «norme sémantique» serait certainement d'utiliser des tables. Comme d'autres l'ont dit, il s'agit de vos données tabulaires de base. C'est pour ça qu'ils sont, fin de l'histoire.

Cependant, si vous ne pouvez pas utiliser les tables, je dirais que la structure suivante la plus sémantiquement significative serait une liste, car il vous permet de définir les relations entre les éléments, comme ceci:

<ul> 
<li>Col1 
    <ul> 
    <li>A</li> 
    <li>B</li> 
    <li>C</li> 
    </ul></li> 
<li>Col2 
    <ul> 
    <li>D</li> 
    <li>E</li> 
    <li>F</li> 
    </ul></li> 
</ul> 

Ensuite, le pire de tout serait divs. "Pire" parce qu'ils n'ont pas de signification sémantique. Tag-soupe, fondamentalement.

+1

Je ne suis pas d'accord. Les données ne doivent pas recevoir de sémantique de liste à moins que les données ne soient réellement une liste. Aucune sémantique n'est préférable à une sémantique erronée. Le problème est, à partir de l'exemple donné par le PO, il est impossible de dire si les données sont une liste ou non. – Alohci