Styles disponibles avec cette base CSS

Published : 21 April 2011 – updated on 21 December 2021 – by tetue

1
2
3
4
5
9 Votes

Cette base CSS pour SPIP met à disposition plusieurs sélecteurs CSS prédéfinis, prêts à être employés tels quels dans vos pages HTML.

Attention : cette page est mise à jour au fur et à mesure du développement !

Alignements

-  .p : applique la même marge basse que celle des paragraphes par défaut
-  .bloc : idem
-  .box : idem + habillage minimal de la boîte (padding et couleur de fond)

-  .left : place le conteneur en position flottante à gauche
-  .right : place le conteneur en position flottante à droite

-  .first : annule la marge gauche du conteneur
-  .last : annule la marge droite du conteneur
-  .top : annule la marge haute du conteneur
-  .bottom : annule la marge basse du conteneur

-  .odd (impair)
-  .even (pair)
-  .sep (séparateur)

-  .clear : espaceur de bloc (cf. explications)
-  .clearfix : espaceur de bloc (cf. explications)

-  .none : efface (via display: none;)
-  .hidden : masque (via visibility: hidden;)
-  .offscreen : place hors-champ (via position: absolute;)

Typographie

-  .small : change en plus petit la taille du texte (comme <small>)
-  .big : change en plus gros la taille du texte (comme <big>)
-  .caps : transforme le texte avec des petites capitales
-  .h1,.h2,.h3,.h4,.h5,.h6 : applique le même style que celui par défaut du titre homonyme (à employer avec discernement !)
-  .center : centre le texte

Hyperliens


-  .on : expose en gras (cf. fonctionnement)

Messages système


-  .info : définit un encart pour message informatif (bleu)
-  .success : définit un encart pour message de confirmation positif (vert)
-  .notice : définit un encart pour message d’alerte (jaune)
-  .error : définit un encart pour message d’erreur (rouge)

Développement


-  .todo : rend le conteneur translucide et opaque au survol. Utile pour signaler, en cours de développement, les blocs restant à faire.

Pour celles et ceux qui connaissent, cette base CSS est proche d’un framework tel que BluePrint. Pour plus de détail, consultez le code des feuilles de style CSS générées après installation du plugin.

Discussion

5 years 1 year 3 months Without limit
par date
Filter

No discussion

Add a comment

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Who are you?
[Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom