Styl opvulling Eiendom
Voorbeeld
Stel die opvulling van 'n <div>-element:
document.getElementById("myDiv").style.padding = "50px 10px 20px 30px";
Definisie en gebruik
Die padding-eienskap stel of gee die opvulling van 'n element terug.
Hierdie eiendom kan van een tot vier waardes neem:
Beide die marge-eienskap en die padding-eienskap voeg spasie om 'n element in. Die verskil is egter dat marge die spasie om die grens invoeg, terwyl opvulling die spasie binne die grens van 'n element invoeg.
- Een waarde, soos: div {padding: 50px} - al vier kante sal 'n opvulling van 50px hê
- Twee waardes, soos: div {padding: 50px 10px} - die boonste en onderste vulling sal 50px wees, linker- en regtervulling sal 10px wees
- Drie waardes, soos: div {padding: 50px 10px 20px} - die boonste vulling sal 50px wees, linker- en regtervulling sal 10px wees, onderste vulling sal 20px wees
- Vier waardes, soos: div {padding: 50px 10px 20px 30px} - die boonste vulling sal 50px wees, regter vulling sal 10px wees, onderste vulling sal 20px wees, linker vulling sal 30px wees
Blaaierondersteuning
| Property | |||||
|---|---|---|---|---|---|
| padding | Yes | Yes | Yes | Yes | Yes |
Sintaksis
Gee die opvulling-eienskap terug:
object.style.padding
Stel die opvulling-eienskap:
object.style.padding = "%|length|initial|inherit"
Eiendomswaardes
| 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 |
Tegniese besonderhede
| Standaard waarde: | 0 |
|---|---|
| Terugkeerwaarde: | 'n String, wat die vulling van 'n element voorstel |
| CSS weergawe | CSS1 |
Meer voorbeelde
Voorbeeld
Verander die opvulling van al vier kante van 'n <div>-element na "25px":
document.getElementById("myDiv").style.padding = "25px";
Voorbeeld
Gee die opvulling van 'n <div>-element terug:
alert(document.getElementById("myDiv").style.padding);
Voorbeeld
Verskil tussen die marge-eienskap en die opvulling-eienskap:
function changeMargin() {
document.getElementById("myDiv").style.margin = "100px";
}
function changePadding() {
document.getElementById("myDiv2").style.padding = "100px";
}
Verwante bladsye
CSS handleiding: CSS Padding
CSS verwysing: padding eiendom
❮ Stylvoorwerp