Proprietà per il padding

 

Proprietà

Valori

padding

padding-top 
padding-right 
padding-bottom 
padding-left

padding-bottom

<lunghezza>

padding-left

<lunghezza>

padding-right

<lunghezza>

padding-top

<lunghezza>

Esempi dimostrativi delle funzionalità di alcune proprietà per il padding:

·         Esempio: uso della proprietà padding

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.

torna alla tabella

padding-bottom

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.

torna alla tabella

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.

torna alla tabella

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.

torna alla tabella

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.

torna alla tabella