Propriedade width do estilo

Definição e uso

propriedade width Define ou retorna a largura do elemento.

propriedade width A propriedade é válida apenas para elementos de bloco ou que tenham alinhamento absoluto ou fixo. O conteúdo excedente pode ser configurado usando Propriedade overflow para lidar com.

Dica:Use Propriedade height Defina ou retorne a altura do elemento.

Veja também:

Tutorial CSS:Dimensão CSS

Tutorial CSS:Modelo de caixa CSS

Manual de referência CSS:Propriedade width

Exemplo

Exemplo 1

Defina a largura do elemento <button>:

document.getElementById("myBtn").style.width = "300px";

Experimente você mesmo

Exemplo 2

Altere a largura do elemento <div>:

document.getElementById("myDIV").style.width = "500px";

Experimente você mesmo

Exemplo 3

Altere a altura e largura do elemento <img>:

document.getElementById("myImg").style.height = "300px";
document.getElementById("myImg").style.width = "300px";

Experimente você mesmo

Exemplo 4

Retorne a largura do elemento <img>:

alert(document.getElementById("myImg").style.width);

Experimente você mesmo

Sintaxe

Retorne a propriedade width:

object.style.width

Defina a propriedade width:

object.style.width = "auto|length|%|initial|inherit"

Valor da propriedade

Valor Descrição
auto Configura a largura do navegador. Padrão.
length Define a largura, em unidades de comprimento.
% Define a largura do elemento pai, em porcentagem.
initial Defina essa propriedade como seu valor padrão. Veja initial.
inherit Herda essa propriedade do elemento pai. Veja inherit.

Detalhes técnicos

Valor padrão: auto
Retorno: Cadeia de caracteres, que representa a largura do elemento.
Versão do CSS: CSS1

Navegador suporta

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Suporte Suporte Suporte Suporte Suporte