Petit point sur les listes en XHTML et CSS
04 mar

Je m'aperçois quelques fois que les listes en XHTML, c'est-à-dire les balises ol et ul, ne sont pas exploitées à leur maximum. Connaissiez-vous les attributs type, start et compact ? Ainsi que les listes stylisées entre autres en katakana-iroha ? Allez, une p'tite révision ne fera pas de mal…
A noter, les listes sont recomandées pour l'accessibilité des sites Internet.
Liste numérotées ol en XHTML
Ci-après les attributs disponibles en XHTML Transitionnel et Frameset et leur compatibilité navigateur.
Liste numérotées par défaut
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste numérotées compactes
Attribut compact="compact"
Firefox 1.5Firefox 2.0Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0Safari 2.0Opera 9.0
Liste numérotées initialisées
Attribut start (ici initialisé à "1234")
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste numérotées par type
Liste numérotées type numérique arabe
Attribut type="1"
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste numérotées type alphabétique minuscules
Attribut type="a"
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste numérotées type alphabétique majuscules
Attribut type="A"
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste numérotées type romain minuscules
Attribut type="i"
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste numérotées type romain majuscules
Attribut type="I"
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste numérotées ol en CSS
Voici un petit tableau récapitulatif des styles de liste via la propriété list-style-type :

Ci-après les valeurs de la propriété list-style-type et leur compatibilité navigateur.
Liste numérotés par glyphes
Liste stylisées en circle
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste stylisées en disc
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste stylisées en square
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste numérotés par chiffres
Liste stylisées en decimal
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste stylisées en decimal-leading-zero
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0Safari 2.0- Opera 9.0
Liste numérotés par langues (minuscules / majuscules)
Liste stylisées en lower-alpha
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste stylisées en upper-alpha
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste stylisées en lower-latin
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0- Safari 2.0
- Opera 9.0
Liste stylisées en upper-latin
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0- Safari 2.0
- Opera 9.0
Liste stylisées en lower-roman
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste stylisées en upper-roman
- Firefox 1.5
- Firefox 2.0
- Internet Explorer 5.5
- Internet Explorer 6.0
- Internet Explorer 7.0
- Safari 2.0
- Opera 9.0
Liste stylisées en lower-greek
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0- Safari 2.0
- Opera 9.0
Liste numérotés par langues
Liste stylisées en armenian
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0Safari 2.0- Opera 9.0
Liste stylisées en cjk-ideographic
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0Safari 2.0Opera 9.0
Liste stylisées en georgian
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0Safari 2.0- Opera 9.0
Liste stylisées en hebrew
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0- Safari 2.0
Opera 9.0
Liste stylisées en hiragana
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0Safari 2.0Opera 9.0
Liste stylisées en hiragana-iroha
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0Safari 2.0Opera 9.0
Liste stylisées en katakana
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0Safari 2.0Opera 9.0
Liste stylisées en katakana-iroha
- Firefox 1.5
- Firefox 2.0
Internet Explorer 5.5Internet Explorer 6.0Internet Explorer 7.0Safari 2.0Opera 9.0
Shemu.
- Catégorie
- Tutoriels XHTML/CSS
- Lien permanent
- #172
- Syndication
- RSS














