Notes de cours sur les feuilles de style (CSS)

Propriété de Dimensionnement:
– Height :longeur
– Width :longeur
Exemple : h1{ Height : 3cm ;
width : 7cm ;}
Exemple : div{ Height : 7cm ;
width : 10cm ;}
– Min-height :longeur max-height :longeur
– Min-midth :longeur max-midth :longeur
– Min-midth :longeur
width : url(« image.gif « ),text;}
Propriété de Dimensionnement:
– Height :longeur
– Width :longeur
Exemple : h1{ Height : 3cm ;
width : 7cm ;}
Exemple : div{ Height : 7cm ;
width : 10cm ;}
width : url(« image.gif « ),text;}
Propriété de marges:
– margin-(top|right|bottom|left) :longeur ;
Exemple :p1{ margin-top :5px ;} p1{ margin-bottom :2cm} ;
Exemple :p{ margin:2cm 4cm 2cm 4cm ;} – p(magin : Top R B Left) par ordre
Exemple :p{ margin:2cm 4cm ;} – p(magin : Top Right) par ordre
Exemple :p{ margin:2cm ;} – toutes les marges sont à 2cm
Propriétés de padding:
– padding-(top|right|bottom|left) :longeur ;
Exemple :h3{ padding -top :3px ;}
Exemple :h3{ padding:3cm ;} – toutes les padding sont à 3px
Propriétés de bordures:
– border-(top|right|bottom|left)-(width|style|color) :valeur ;
width(thin|meduim|thick|valeur Numérique)
Exemple :h3{ border -top-width :thin ;}
Exemple :h3{ border – width :thin ;} (groupement)
style (none|solid|dotted|dashed|double|groove|ridhe|inset|outset)
Exemple :h3{ border -top-style :solid ;}
Exemple :h3{ border – style : solid ;} (groupement)
color (none|solid|dotted|dashed|double|groove|ridhe|inset|outset)
Exemple :h3{ border -top-color :red ;}
Exemple :h3{ border – color : green ;} (groupement)
Exemple :h3{ border:5px solid green ;} (groupement général )
Propriétés de miste:
– liste-style-(type|position|image) :valeur ;
type pour liste ol (decimal (1 2 …) | lower-roman(i ii …) | upper-roman(I II ..) | lower-alpha(a b …)
|upper-alpha | lower-latin|upper-latin | decimal-leading-zero (01 02 …) | lower-greek(alpha betta ..)
type pour liste ul (disc, circle , square, ou none)
position (inside | outside)
image :url(« image.gif ou jpg »)
liste-style (groupement) :
ul { liste-style :square inside url(« /images/pic.jpg »);}
Exemple :h3{ border -top-style :solid ;}
Exemple :h3{ border – style : solid ;} (groupement)
color (none|solid|dotted|dashed|double|groove|ridhe|inset|outset)
Fisrt letter :
ionel Messi p: first-letter{font-size:36pt;
naît le 24 juin 1987 à Rosario font-family:garamond;
dans la province de Santa Fe color:red; }
Il est le fils de Jorge Horacio Messi
et Celia Maria Cuccittini
:before
.definition{ font-size :24pt ;
font-style :italic ;
font-weight :200 ;
}
<div class= »definition »>
I i i i i i i i
</div>
Exemple : div.definition :before{content : (« DEFINITION ») ;}
L
Pseudo-classes: POUR LES LIENS
a :link{color :pink ;}
a :visited{color :black ;}
a :active{color :green
font-size :18pt ;}
a :hover{font-size :36pt ;
text-decoration :none ;}
Pseudo-classes: POUR TOUES LES BALISES
:hover
h1 :hover{background :red ;}
input :hover{background :red ;}
a :active{color :green
:focus
input :focus{font-size :18pt ;}

Si le lien ne fonctionne pas correctement, veuillez nous contacter (mentionner le lien dans votre message)
Notes de cours sur les feuilles de style (CSS) (772 KO) (Cours PDF)