Je vais vous donner ici le plus de propriétés CSS que vous pourrez ensuite appliqué pour vos pages au sujet des boîtes. N'hésitez pas à me demander d'en ajouter si j'en ai oublié.
width : Largeur
height : Hauteur
Dimensions
Code :
- Code: Tout sélectionner
width : Valeur en px, %, ou encore "auto" (la largeur dépendra du texte à l'intérieur)
height : Valeur en px, %, ou encore "auto" (la hauteur dépendra du texte à l'intérieur)
Il existe aussi des attributs pour une valeur minimale ou maximale (problème d'affichage sous IE) :
min-width : Indiquer une valeur, en px par exemple.
max-width : Indiquer une valeur, en px par exemple.
min-height : Indiquer une valeur, en px par exemple.
max-height : Indiquer une valeur, en px par exemple.
Marges intérieures : Padding
Code :
- Code: Tout sélectionner
Cette marge s'appelle 'padding' :
padding-top : Indiquer une valeur comme 25px...
padding-left : Indiquer une valeur comme 25px...
padding-right : Indiquer une valeur comme 25px...
padding-bottom : Indiquer une valeur comme 25px...
De facon plus général, on peut tout regrouper en une propriété :
padding: 2px 5px 0px 12px;
Qui s'écrira aussi :
padding-top: 2px;
padding-right: 5px;
padding-bottom: 0px;
padding-left: 12px;
On peut faire cela aussi :
padding: 0px, auto...
Marges extérieurs : Margin
Code :
- Code: Tout sélectionner
Cette marge s'appelle 'margin' :
margin-top : Indiquer une valeur comme 25px...
margin-left : Indiquer une valeur comme 25px...
margin-right : Indiquer une valeur comme 25px...
margin-bottom : Indiquer une valeur comme 25px...
De facon plus général, on peut tout regrouper en une propriété :
margin: 2px 5px 0px 12px;
Qui s'écrira aussi :
margin-top: 2px;
margin-right: 5px;
margin-bottom: 0px;
margin-left: 12px;
On peut faire cela aussi :
margin: 0px, auto...
Astuce : ": 2px 5px 0px 12px;" se lit dans le sens des aiguilles.
A bientôt les pinguins
