MDC:Classes CSS personnalisées
Un article de MDC.
- Comment aider : contenu
- Listes
- Pages à traduire
- Traductions à relire
- Traductions en cours
- Guides
- Pour commencer
- Guide du rédacteur
- Guide de nommage des pages
- Pages de désambiguation
- Commencer une nouvelle localisation de MDC
- Copyrights et licences
- Références
- Référence des balises wiki
- Classes CSS personnalisées
- Modèles personnalisés
- Extensions MediaWiki
- Redirections externes
- Redirections nécessaires
Cette page liste les classes CSS qui ont été spécifiquement créées pour MDC. Si vous avez d'autres idées de classes CSS qui pourraient être utiles pour ce wiki, n'hésitez pas à contacter Dria (en).
Sommaire |
[modifier] Liste des classes CSS
| Classe | Résultat |
div.tip |
Affiche le texte d'une astuce dans le corps de la page. |
div.bug |
Affiche un texte de bogue dans le corps de la page. |
.float-left |
Crée un élément flottant à gauche (généralement une image). |
.float-right |
Crée un élément flottant à droite (généralement une image). |
.figure |
Défini pour un usage futur, ne contient actuellement aucun style |
.standard-table |
Style de tableau standard simple. |
.standard-table td.header |
Style d'en-tête d'un tableau standard. |
.fullwidth-table |
Tableau ayant une largeur définie à 100% (ce tableau en est un exemple.) |
.fullwidth-table td.header |
Style d'en-tête d'un tableau de largeur 100%. |
div.breadcrumbs |
Style de l'extension breadcrumbs personnalisée. |
div.breadcrumbs a.breadcrumbs |
Style de lien dans une chaîne breadcrumbs. |
div.breadcrumbs span.breadcrumbs |
Style de titre de page locale dans une chaîne breadcrumbs. |
div.highlight |
Met en évidence une partie de la page avec une barre bleue verticale, à gauche, de 3px de large. |
.highlightred |
Change la couleur de texte en rouge. |
.highlightblue |
Change la couleur de texte en bleu. |
.highlightgreen |
Change la couleur de texte en vert. |
[modifier] Exemples
[modifier] Mettre en évidence des parties de code
On souhaite souvent attirer l'attention sur certaines parties d'un morceau de code. Ceci est possible grâce à l'usage des balises span, en utilisant à la fois la fonction de formatage de code intégrée dans MediaWiki dite « indenter-d'au-moins-un-espace ». Remarquez qu'utiliser des spans à l'intérieur de blocs <pre> n'est pas une solution, car le parser MediaWiki ignore les spans et les traite simplement comme des parties du code.
<span class="highlightred">ceci ne fonctionne pas</span>
Au lieu de cela, il faut indenter le morceau de code, et à l'intérieur utiliser la balise span pour la mise en évidence. Remarquez qu'il faudra aussi indenter des lignes vierges dans le bloc de code. S'il n'y a pas d'espace au début de la ligne vierge, le parser fermera le bloc de code, puis le rouvrira à la prochaine ligne de code indentée.
voici un exemple
d'un bloc de code avec une ligne vierge
qui n'est pas indentée.
Manifestement, l'exemple ci-dessus est incorrect. Voici comment le faire:
voici un exemple d'un bloc de code avec une ligne vierge qui n'est pas indentée.
[modifier] Breadcrumbs
- Voir également Référence de JavaScript 1.5 Core:À propos pour un exemple de page utilisant cette extension.
[modifier] table.standard-table
| En-tête de tableau 1</td>
<th>En-tête de tableau 2</td> |
|---|
| En-tête de tableau 1</td>
<th>En-tête de tableau 2</td> |
|---|