Resume css
Cours CSS
E.Coquery emmanuel.coquery@liris.cnrs.fr
Cours CSS/JavaScript CSS
CSS
Cascading Style Sheets Principe : s´paration du style et de la structure e HTML → Structure paragraphes, tableaux, liens, ...
CSS → Style polices de caract`res, couleurs, position, bordures ... e
Cours CSS/JavaScript CSS
CSS : syntaxe
Fichier CSS indiqu´ par : e dans ... s´lecteur { e nom-propri´t´ : valeur ; e e nom-propri´t´2 : valeur2 ; e e ... } s´lecteur2 { e ... }
Cours CSS/JavaScript CSS
CSS : dans le HTML
Possibilit´ d’inclure un style particulier dans une balise : e Attribut style Valeur : chaˆ de caract`res contenant les propri´t´s. ıne e ee
Ce qu’il y a dans les { }
Exemple : ...
Cours CSS/JavaScript CSS S´lecteurs e
S´lecteurs simples e nom de tags : tag li p div correspond ` la balise indiqu´e a e
nom de classes : .classe
.titre .article .vert correspond aux balises dont l’attribut class est classe par exemple si la classe est coll´e ` un tag, ce s´lecteur ne fonctionne que e a e pour ce tag. div.titre fonctionne pour mais pas pour
nom d’objet : #nom
#menu #logo correspond aux balises dont l’attribut id est nom au maximum une balise pour un nom donn´ e
Cours CSS/JavaScript CSS S´lecteurs e
S´lecteurs - 2 e
Possibilit´ de partager des propri´t´s entre s´lecteurs : e ee e selecteur1, selecteur2 { . . . les propri´t´s vont s’appliquer sur les balises correspondant ` ee a selecteur1 ou ` selecteur2 a
Possibilit´ de cumuler des s´lecteurs en les s´parant avec des e e e espaces : selecteur1 selecteur2 { . . . les propri´t´s vont s’appliquer sur les balises correspondant ` ee a selecteur2 qui sont dans des balises correspondant ` a selecteur1 exemple : div a { ... s’applique sur la balise a dans : ...............
Cours CSS/JavaScript CSS S´lecteurs e
Pseudo-classes
Correspondent ` un ´tat d’un lien : a e a :link {. . . lien non visit´ e
a :visited {. . . lien visit´ e