Proprietà CSS padding

Definizione e uso

La proprietà abbreviata padding imposta tutte le proprietà di spaziatura interna in una dichiarazione.

Spiegazione

Questa proprietà abbreviata imposta la larghezza di tutti gli spazi interni dell'elemento, o imposta la larghezza degli spazi interni di ciascun lato. Gli spazi interni impostati sugli elementi inline non sostitutivi non influenzano il calcolo dell'altezza delle righe; di conseguenza, se un elemento ha sia spazi interni che sfondo, potrebbe estendersi visivamente oltre altre righe e potrebbe sovrapporsi ad altri contenuti. Lo sfondo dell'elemento si estende attraverso gli spazi interni. Non è permesso specificare valori di margine negativi.

Nota:Non è permesso utilizzare valori negativi.

Esempio 1

padding:10px 5px 15px 20px;
  • Il margine superiore è di 10px
  • Il margine destro è di 5px
  • Il margine inferiore è di 15px
  • Il margine sinistro è di 20px

Esempio 2

padding:10px 5px 15px;
  • Il margine superiore è di 10px
  • Il margine destro e sinistro sono di 5px
  • Il margine inferiore è di 15px

Esempio 3

padding:10px 5px;
  • Il margine superiore e inferiore sono di 10px
  • Il margine destro e sinistro sono di 5px

Esempio 4

padding:10px;
  • Tutti i 4 spazi interni sono di 10px

Vedi anche:

Tutorial CSS:Margine interno CSS

Manuale HTML DOM:Proprietà padding

Esempio

Imposta i 4 spazi interni dell'elemento p:

p
  {
  padding:2cm 4cm 3cm 4cm;
  }

Prova da solo

Sintassi CSS

padding: length|initial|inherit;

Valore dell'attributo

Valore Descrizione
auto Il browser calcola l'interno.
length Definisce il valore dell'interno in unità specifiche, come pixel, centimetri ecc. Il valore predefinito è 0px.
% Definisce l'interno in percentuale della larghezza dell'elemento padre.
inherit Definisce che l'interno deve essere ereditato dal elemento padre.

Dettagli tecnici

Valore predefinito: 0
Ereditarietà: no
Versione: CSS1
Sintassi JavaScript: object.style.padding="10px 5px"

Esempio TIY

Tutte le proprietà di spaziatura interna in una dichiarazione
Questo esempio dimostra come utilizzare l'attributo abbreviato per impostare tutte le proprietà di spaziatura interna in una dichiarazione, che può avere da uno a quattro valori.

Supporto del browser

I numeri nella tabella indicano la versione del browser iniziale che supporta completamente l'attributo.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5