Proprietà per il padding
Valori |
|
padding-top |
|
<lunghezza> |
|
<lunghezza> |
|
<lunghezza> |
|
<lunghezza> |
Esempi dimostrativi delle funzionalità di alcune proprietà per il padding:
· Esempio: uso della proprietà padding
La proprietà padding (imbottitura) è
una proprietà a sintassi abbreviata che viene utilizzata per definire lo spazio
che deve essere lasciato tra i contenuti di un elemento e il suo bordo o il suo
margine.
Il padding può essere specificato per ogni singolo lato attraverso le
proprietà:
· padding-top;
· padding-right;
· padding-bottom;
· padding-left.
h1{
padding: 10px;
}
In questo esempio all'elemento h1 viene applicato un padding di 10 pixel.
Tutte le proprietà per definire il padding non ammettono valori negativi.
La proprietà padding-bottom viene utilizzata
per definire lo spazio che deve essere lasciato tra i contenuti di un elemento e
il suo bordo o il suo margine inferiore.
La proprietà padding-bottom ammette i seguenti valori:
· <lunghezza> (px,em, etc.);
· % (valori percentuali).
h1{
padding-bottom: 10px;
}
In questo esempio all'elemento h1 viene applicato un padding inferiore di 10px.
padding-left
La proprietà padding-left viene utilizzata per
definire lo spazio che deve essere lasciato tra i contenuti di un elemento e il
suo bordo o il suo margine sinistro.
La proprietà padding-left ammette i seguenti valori:
· <lunghezza> (px,em, etc.);
· % (valori percentuali).
h1{
padding-left: 10px;
}
In questo esempio all'elemento h1 viene applicato un padding sinistro di 10px.
padding-right
La proprietà padding-right viene utilizzata
per definire lo spazio che deve essere lasciato tra i contenuti di un elemento
e il suo bordo o il suo margine destro.
La proprietà padding-right ammette i seguenti valori:
· <lunghezza> (px,em, etc.);
· % (valori percentuali).
h1{
padding-right: 10px;
}
In questo esempio all'elemento h1 viene applicato un padding destro di 10px.
padding-top
La proprietà padding-top viene utilizzata per
definire lo spazio che deve essere lasciato tra i contenuti di un elemento e il
suo bordo o il suo margine superiore.
La proprietà padding-top ammette i seguenti valori:
· <lunghezza> (px,em, etc.);
· % (valori percentuali).
h1{
padding-top: 10px;
}
In questo esempio all'elemento h1 viene applicato un padding superiore di 10px.