La balise span

A propos de la Balise < SPAN >

La balise HTML et XHTML SPAN est utilisée pour créer des propriétes css à un endroit précis. Dans ce cas, la balise HTML et XHTML n’introduit pas de saut de lignes.

<h1 class="black">
Le début de mon titre sera d'une couleur
     <span class="red">
la suite d'une autre
     </span>
</h1>

<span> : pour remplacer les balises vieillottes ?

L’emploi de la balise neutre <span> peut paraître incongru au premier abord. En effet, cela implique un code relativement complexe, simplement pour éviter d’utiliser la simple balise <i> :

<p>Un texte affiché <span class="italique">en italique</span></p>

.italique {font-style: italic;}

Si l’objectif se limite à afficher le texte en italique et que la balise n’a aucune autre fonction d’emphase, de citation, etc. C’est pourtant la solution qu’il conviendrait d’employer.

Les recommandations expliquent ce point :

Les éléments DIV et SPAN, en conjonction avec les attributs id et class, offrent un mécanisme générique qui rajoute de la structure aux documents. Ces éléments définissent le contenu comme étant en-ligne (SPAN) ou de bloc (DIV) mais n’imposent aucune autre expression de présentation sur le contenu. Ainsi, les auteurs peuvent utiliser ceux-ci en conjonction avec les feuilles de style, l’attribut lang, etc., pour exploiter HTML selon leurs besoins et leurs goûts propres.

L’exemple suivant précise l’emploi de la balise <span> :

<span class="client-title">
Informations sur le client :
</span>

Par la suite, nous pourrons facilement rajouter des déclarations de feuilles de style pour affiner la présentation de ces entrées de la base de données. Pour un autre exemple d’utilisation, veuillez consulter l’exemple dans la section sur les attributs class et id.

Même si le résultat est plus lourd qu’en utilisant les balises <i> et <b>, il est préférable d’utiliser cette technique, à condition que l’objectif soit uniquement d’obtenir un effet visuel italique ou gras.