Sommaire

Des styles en ligne

Foundation vous propose des mises en forme spécifiques pour les éléments <small>, <code>, <kbd> et <abbr>.

Le texte dans l’élément <small> est affiché plus petit et en gris.

Le texte dans l’élément <code> est sur fond gris, avec une fine bordure grise.

Le texte dans l’élément <kbd> est sur fond gris.

Le texte dans l’élément <abbr> s’affiche dans une bulle à fond gris et le pointeur est un point d’interrogation.

Voici le code HTML utilisé :

<p>Ce texte est <small>petit</small>. C’est du <code>code</code>. C’est  
des <kbd>touches de clavier</kbd>. C’est de l’<abbr title="Hypertext  
Markup Language">HTML</abbr>.</p>

Voici l’affichage obtenu :

images/C07-008.png

Voici les règles CSS utilisées :

small { 
  font-size: 80%; 
  line-height: inherit; 
} 
code { 
  font-family: Consolas, "Liberation Mono", Courier, monospace; 
  font-weight: normal; 
  color: #0a0a0a; 
  background-color: #e6e6e6; 
  border: 1px solid #cacaca; 
  padding: 0.125rem 0.3125rem 0.0625rem; 
} 
kbd { 
  padding: 0.125rem 0.25rem 0; 
  margin: 0; 
  background-color: #e6e6e6; 
  color: #0a0a0a; 
  font-family: Consolas, "Liberation Mono", Courier, ...