Rembourrage de style Propriété
Exemple
Définissez le rembourrage d'un élément <div> :
document.getElementById("myDiv").style.padding = "50px 10px 20px 30px";
Définition et utilisation
La propriété padding définit ou renvoie le remplissage d'un élément.
Cette propriété peut prendre de une à quatre valeurs :
La propriété margin et la propriété padding insèrent toutes deux un espace autour d'un élément. Cependant, la différence est que margin insère l'espace autour de la bordure, tandis que padding insère l'espace dans la bordure d'un élément.
- Une valeur, comme : div {padding : 50px} - les quatre côtés auront un rembourrage de 50px
- Deux valeurs, comme : div {padding : 50px 10px} - le rembourrage supérieur et inférieur sera de 50px, le rembourrage gauche et droit sera de 10px
- Trois valeurs, comme : div {padding : 50px 10px 20px} - le rembourrage supérieur sera de 50px, le rembourrage gauche et droit sera de 10px, le rembourrage inférieur sera de 20px
- Quatre valeurs, comme : div {padding : 50px 10px 20px 30px} - le rembourrage supérieur sera de 50px, le rembourrage droit sera de 10px, le rembourrage inférieur sera de 20px, le rembourrage gauche sera de 30px
Prise en charge du navigateur
| Property | |||||
|---|---|---|---|---|---|
| padding | Yes | Yes | Yes | Yes | Yes |
Syntaxe
Renvoyez la propriété padding :
object.style.padding
Définissez la propriété padding :
object.style.padding = "%|length|initial|inherit"
Valeurs de propriété
| Value | Description |
|---|---|
| % | Defines the padding in % of the width of the parent element |
| length | Defines the padding in length units |
| initial | Sets this property to its default value. Read about initial |
| inherit | Inherits this property from its parent element. Read about inherit |
Détails techniques
| Valeur par défaut: | 0 |
|---|---|
| Valeur de retour : | Une chaîne, représentant le rembourrage d'un élément |
| Version CSS | CSS1 |
Plus d'exemples
Exemple
Changez le rembourrage des quatre côtés d'un élément <div> en "25px":
document.getElementById("myDiv").style.padding = "25px";
Exemple
Renvoie le remplissage d'un élément <div> :
alert(document.getElementById("myDiv").style.padding);
Exemple
Différence entre la propriété margin et la propriété padding :
function changeMargin() {
document.getElementById("myDiv").style.margin = "100px";
}
function changePadding() {
document.getElementById("myDiv2").style.padding = "100px";
}
Pages connexes
Tutoriel CSS : Remplissage CSS
Référence CSS : propriété padding
❮ Objet de style