|
Scritto da Vincenzo
|
|
Il padding è lo spazio che separa il bordo del box model dai contenuti, quindi a differenza del margine, lo spazio, viene inserito all’interno del box model e non all’esterno. Solitamente, quasi tutti i browser, inseriscono di default un margine tra il bordo della finestra e l’area dei contenuti, con l’html veniva eliminato tramite la sintassi:
<body topmargin=”0” leftmargin=”0” marginwidth=”0” marginheight=”0”>
Mentre con la sintassi css lo stesso risultato si può ottenere così:
body{margin:0px; padding:0px;}
Come per i margini, ci sono cinque proprietà, una per ogni singolo lato e una sintassi abbreviata che definisce le proprietà di tutti i lati. Il padding può essere applicato ad ogni elemento e non è una proprietà ereditata, i suoi possibili valori possono essere definiti tramite l’uso di:
un’unità di misura
un valore in percentuale: che varia in base alla larghezza (width) dell’elemento contenitore.
div{padding-<lato>:<valore>;}
Con questa sintassi è possibile assegnare il padding ad un elemento, utilizzando i quattro valori che si riferiscono ad ogni singolo lato: padding-top, padding-right, padding-bottom, padding-left.
div{padding-top:12px;}
div{padding-right:4px;}
div{padding-bottom:5px;}
div{padding-left:10px;}
Lo stesso risultato lo si può ottenere tramite l’utilizzo della sintassi abbreviata padding, ricordiamo che il valori vanno interpretati partendo dal padding-top e ruotando in senso orario.
div{padding: 12px 4px 5px 10px;}
|
Css 
Copyright © 2007-2008