V skladu z modelom bloka je prikazovanje CSS obloge ali polja odmik od zunanje meje elementa do njegove vsebine. CSS vam omogoča upravljanje velikosti oblazinjenja za vsako stran bloka posamezno ali za vse stranke naenkrat. Za pravilno prikazovanje elementa je pomembno razumeti značilnosti izračuna notranjih vdolbin.

skupina padding-properties

Obstaja celotna skupina lastnosti, ki opisujejo oblazinjenje v CSS. To je:

padding-top - nadzoruje vrednost zgornjega polja;

padding-right - spremeni vdolbino;

padding-bottom - nadzoruje velikost spodnje obloge;

padding-left - nastavitev širine vdolbine na levo.

Splošno lastnost oblazinjenja v CSS vam omogoča, da določite vsa štiri polja v enem pravilu. Navodilo lahko sprejme od enega do štirih argumentov:

4 parametra. Obloge se pretvorijo v smeri urinega kazalca, začenši z vrha. Snemanje se uporablja, če ima vsaka stranka svojo velikost zamik.

//oblazinjenje: padding-top padding-right padding-bottom padding-left
.element {
padding: 10px 20px 30px 40px;
}

• 3 parametri. Če so stranske robove enake, jih lahko združimo v en argument. Naročilo za prenos: zgornje, levo in desno, spodnje polje.

//oblazinjenje: padding-top padding-right + padding-left padding-bottom
.element {
 padding: 10px 20px 30px; 
}

• 2 parametra. Delno razvrščanje zgornjega dela z spodnjim in levim z desnimi polji.

//oblazinjenje: padding-top + padding-bottom padding-right + padding-left
.element {
 padding: 10px 20px; 
}

• 1 parameter. Nastavi velikostsamo za vse oblazinjenje.

.element {
 oblazinjenje: 10px; 
}

Mesto v strukturi bloka

Vrednost oblazinjenja v CSS je privzeto vključena v skupno vrednost zasedenega prostorskega elementa.

.block1 {
 širina: 100px;
višina: 100px;
padding-right: 30px;
padding-top: 20px; 
}

Za element.block1bo realna velikost 130px širine in 120px višine. Lastnostiširineinvišineprivzeto določata velikost predmetnega področja, oblazinjenje v CSS pa se meri ločeno.

Merske enote

Določite lahko količino oblazinjenja v vseh enotah razdalje, ki se uporabljajo v CSS - pikslih, odstotkih, em ali rem.

Pomembno: če je odstotek nastavljen na alineo, se vedno odšteje od širine elementa PARENT, četudi je to zgornje ali spodnje polje.

.parent {{64) {irina: 200px;
višina: 100 px; 
}
.block2 {
 višina: 30px;
širina: 100 px;
padding-bottom: 10%; 
}

Za blokblokabo spodnja podloga 20px (10% od 200px), dejanska višina pa 50px.

Za razliko od marže, oblazinjenje v CSS ne sme biti manjše od nič. Pri pošiljanju negativne vrednosti navodilu brskalnik preprosto ne bo upošteval.

Elementi posameznih postavk

Določanje zamikov zamikov za elemente z zaslonom tipa niza ima svoje zapletenosti.

Za bloke, ki so del črte,vrednost zgornjega in spodnjega polja se vedno ignorira, saj lahko motita konstrukcijo.

razpon {
 padding-left: 30px;
padding desno: 20px;
oblazinjenje: 50px;
padding-bottom: 40px; 
}

Levo in desno od elementovrazponase prikažejo ustrezna navodila za vtiskanje, vendar ne bo navpičnega premika linije. V bistvu bo brskalnik nastavil zahtevana polja na blok, vendar to ni pomembno, saj ne vplivajo na njegovo mesto v celotni niti. Lastnost CSS oblazinjenja je dobro podprta v vseh brskalnikih, vključno z najstarejšimi, in se lahko animira tudi z navodili za animacijo in prehod.