2009-07-17 6 views

Répondre

44

Oui, ils sont différents.

Même si vous style une période avec display: block vous ne pouvez toujours pas mettre des éléments au niveau des blocs à l'intérieur:

<div><p>correct</p></div> 
<span style="display: block;"><p>wrong</p></span> 

Le (X) HTML doit encore obéir à la (X) DTD HTML (selon une vous utilisez), peu importe comment le CSS modifie les choses.

+2

Y a-t-il un avantage à utiliser 'span' sur un' div' avec 'display: inline', mis à part le nombre légèrement inférieur de caractères requis? – JAB

+1

OMG Bonne réponse. – VoidKing

1

Oui. Ils peuvent contenir des choses différentes et sont autorisés dans des endroits différents.

Ils seront également rendus différemment dans des environnements où CSS ne sont pas disponibles (par exemple, dans certains systèmes de messagerie)

12

Voici un exemple où il fait une réelle différence (pour le code valide, au moins):

<a href='example.com'> 
    <span class='title' style='display:block;'>The title of the image is also a link</span> 
    <img src="example.com/someimage.jpg"/> 
</a> 

qui vous permet de faire votre espace un élément de niveau bloc et permet à l'image et la durée de mettre en évidence ensemble quand roulé.

Une div ne serait pas valide imbriquée dans une balise a.

+0

Il fait de l'extension _display_ un bloc sur un périphérique qui prend en charge CSS, mais il n'en fait pas un élément de niveau bloc - il reste un élément en ligne. Dans ce cas, c'est en fait ce que vous voulez, car le blocage est purement visuel :-) – NickFitz

+2

Yep. Et c'est la beauté de tout ça. Bien que cela semble moins merveilleux sans la feuille de style. –

+0

Il est dommage que vous discutiez vraiment de la validité, puisque votre exemple fournit une différence réelle et pratique dans les navigateurs, que vous vous souciez ou non de la validité du HTML. – Alohci

3

Un <div> est un élément de niveau bloc qui n'a pas de sémantique spécifique, au-delà de la définition d'un bloc de contenu discret. Un <span> est un élément en ligne qui ne possède pas de sémantique spécifique, au-delà de la définition d'un segment discret de contenu en ligne.

Vous pouvez utiliser CSS pour faire un affichage de span en tant que bloc, mais il n'y a absolument aucune raison de le faire EDIT: autre que pour les effets purement visuels, comme le démontre Gabriel; Ce que je veux dire, c'est que vous ne devriez pas utiliser CSS pour essayer de forcer une échelle à avoir une signification au niveau du bloc en termes de structure de document. De plus, si vous le faites, votre contenu apparaîtra probablement dénué de sens pour un utilisateur sans CSS, tel qu'un utilisateur aveugle, ou un moteur de recherche.

Si c'est un bloc, utilisez un div. Si cela fait partie du contenu en ligne, utilisez une durée. Rappelez-vous, CSS est sur la seule présentation; votre balisage doit toujours être structuré de manière logique si votre contenu doit être utilisable. Pour plus de détails, voir http://www.w3.org/TR/html401/struct/global.html#edef-DIV pour plus de détails.

+1

La déclaration "absolument aucune raison de le faire" est manifestement fausse. –

+0

@Gabriel: Je viens d'éditer mon commentaire pour référencer votre exemple, où vous démontrez un bon usage de présentation :-) – NickFitz

Questions connexes