Esempio
Impostare l'altezza e la larghezza di <p> elemento:
p.ex
{
height: 100px;
width: 100px;
}
Prova tu stesso " Più "Try it Yourself" esempi di seguito.
Definizione e utilizzo
La proprietà width imposta la larghezza di un elemento.
Note: La proprietà width non include padding, bordi o margini; imposta la larghezza dell'area all'interno del padding, bordo e margine dell'elemento!
Note: Il min-width e max-width Proprietà di sostituzione di larghezza.
| Valore di default: | auto |
|---|---|
| Inherited: | no |
| animatable: | yes. Read about animatable Try it |
| Versione: | CSS1 |
| sintassi JavaScript: | object .style.width="500px" Try it |
Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente la proprietà.
| Proprietà | |||||
|---|---|---|---|---|---|
| width | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
CSS Sintassi
width: auto|value|initial|inherit;I valori delle proprietà
| Valore | Descrizione | Gioca |
|---|---|---|
| auto | Valore di default. Il browser calcola la larghezza | Gioca " |
| length | Definisce la larghezza in px, cm, etc. | Gioca " |
| % | Definisce la larghezza in percentuale del blocco contenitore | Gioca " |
| initial | Consente di impostare questa proprietà al suo valore di default. Leggi iniziale | Gioca " |
| inherit | Eredita questo immobile dal suo elemento genitore. Leggi su erediterà |
Altri esempi
Esempio
Impostare la larghezza di un <img> elemento utilizzando un valore percentuale:
img {
width: 50%;
} Prova tu stesso " Esempio
Impostare la larghezza di un <input type = "text"> elemento di 100px. Tuttavia, quando si fa fuoco, renderlo 250px di larghezza:
input[type=text] {
width: 100px;
}
input[type=text]:focus {
width: 250px;
} Prova tu stesso " Pagine correlate
Tutorial CSS: CSS Dimension
Tutorial CSS: il modello CSS Box
Riferimento CSS: height property
Di riferimento HTML DOM: width property