Exemplo
Definir a altura e largura de um <p> elemento:
p.ex
{
height: 100px;
width: 100px;
}
Tente você mesmo " Mais "Try it Yourself" exemplos abaixo.
Definição e Uso
A propriedade width define a largura de um elemento.
Note: A propriedade de largura não inclui preenchimento, bordas, ou margens; ele define a largura da área dentro do espaçamento, borda e margem do elemento!
Note: O min-width e max-width propriedades substituir largura.
| Valor padrão: | auto |
|---|---|
| Herdado: | no |
| Animatable: | yes. Read about animatable Try it |
| Versão: | CSS1 |
| sintaxe JavaScript: | object .style.width="500px" Try it |
Suporte a navegadores
Os números na tabela especificar a primeira versão do browser que suporta totalmente a propriedade.
| Propriedade | |||||
|---|---|---|---|---|---|
| width | 1.0 | 4.0 | 1.0 | 1.0 | 3,5 |
CSS Syntax
width: auto|value|initial|inherit;Valores de propriedade
| Valor | Descrição | Jogue |
|---|---|---|
| auto | Valor padrão. O navegador calcula a largura | Jogue " |
| length | Define a largura em px, cm, etc. | Jogue " |
| % | Define a largura em percentagem do bloco contendo | Jogue " |
| initial | Define essa propriedade para o valor padrão. Leia sobre inicial | Jogue " |
| inherit | Herda essa propriedade do seu elemento pai. Leia sobre herdar |
mais Exemplos
Exemplo
Definir a largura de um <img> elemento usando um valor percentual:
img {
width: 50%;
} Tente você mesmo " Exemplo
Definir a largura de um <input type = "text"> elemento para 100px. No entanto, quando ele recebe o foco, torná-lo 250px de largura:
input[type=text] {
width: 100px;
}
input[type=text]:focus {
width: 250px;
} Tente você mesmo " Páginas relacionadas
Tutorial CSS: CSS Dimensão
Tutorial CSS: modelo CSS Box
Referência CSS: height property
HTML DOM de referência: width property