Joseph Tux
Aide mémoire

CSS2

samedi 21 février 2009

Ici on se limite à l’usage des CSS pour du HTML

Celà aura peu d’impact pour les autre XML : seule les spécificités du langage HTML sont abordées (liste de sélecteurs), mais les règles générales sont toujours applicables.

 Introduction

Une règle CSS :

Sélecteurs : liste de sélecteurs séparés par une virgule ,

suivi par :

  • Un bloc de déclarations, séparées par un point virgule  ;
  • Le bloc est encadré par des accolades {}

 Sélecteurs

Toute balise HTML ( html, p, h2 .. )

Sélecteur de classe (html : class=un_nom_de_classe) : le point .

  • *.un_nom_de_classe

Classes multiples
ex : html: <p class="urgent important"> Texte urgent et important </p>

  • exemple ( ici les 3 déclarations seront appliquées ) :
    • .urgent {font-style: italic;}
    • .important {font-weight: bold}
    • .urgent.important{background: yellow}

Sélecteur d’identifiant (html : id=un_nom) : le dièse #

  • exemple :
    • *#un_nom_unique
  • ( pas d’identifiant multiple en html )

h2Sélecteurs d’attributsh2

  1. Sélecteur d’attribut simple : les crochets droits [attribut=« valeur » ]
  • exemple : tous les h1 avec un élément class (quelque soit sa valeur )
    • h1[class] {color:blue}
  • (surtout utile en xml)
  1. Sélecteur d’attribut d’après sa valeur exacte : [ info=« exactes »]
  • exemple :
    • a[href="http://joseph-tux.fr/spip.php?article3&var_mode=recalcul"] {font-weight: bold}
  • Sélecteur d’attribut d’après une valeur partielle [attribut =« partie » ]
  • exemple :
    • p[class =« urge »] s’applique au paragraphes

      texte urgent

  • Sélecteur d’attribut particulier : [attribut|=« particulier »]
  • Tout ce qui commence par « particulier »

 Déclarations


Accueil | Contact | Plan du site | | Statistiques du site | Visiteurs : 204 / 57749

Suivre la vie du site fr  Suivre la vie du site Webologie   ?

Site réalisé avec SPIP 3.1.6 + AHUNTSIC

Creative Commons License