Los últimos tutoriales de desarrollo web
 

Style width Property

<Estilo de objeto

Ejemplo

Ajuste el ancho de un <button> elemento:

document.getElementById("myBtn").style.width = "300px";
Inténtalo tú mismo "

Definición y Uso

La propiedad anchura fija o devuelve el ancho de un elemento.

La propiedad anchura tiene efecto sólo en elementos en bloque o en elementos con posición absoluta o fija. El contenido de desbordamiento puede ser manipulado con la propiedad de desbordamiento.

Consejo: Utilice la altura de propiedad para establecer o devolver la altura de un elemento.


Soporte del navegador

Internet ExplorerFirefoxOperaGoogle ChromeSafari

La propiedad width es compatible con todos los principales navegadores.


Sintaxis

Devolver la propiedad width:

object .style.width

Establecer la propiedad width:

object .style.width="auto| Valores de propiedad
Valor Descripción
auto El navegador establece el ancho. Esto es por defecto
length Define la anchura en unidades de longitud
% Define la anchura en% del elemento padre
initial Establece esta propiedad a su valor por defecto. Lea acerca inicial
inherit Hereda esta propiedad de su elemento padre. Lea acerca de heredar

Detalles técnicos

Valor por defecto: auto
Valor de retorno: Una cadena, que representa el ancho de un elemento
Versión CSS CSS1

Más ejemplos

Ejemplo

Cambiar el ancho de un <div> elemento:

document.getElementById("myDIV").style.width = "500px";
Inténtalo tú mismo "

Ejemplo

Cambiar la altura y la anchura de un <img> elemento:

document.getElementById("myImg").style.height = "300px";
document.getElementById("myImg").style.width = "300px";
Inténtalo tú mismo "

Ejemplo

Devolver el ancho de un <img> elemento:

alert(document.getElementById("myImg").style.width);
Inténtalo tú mismo "

Páginas relacionadas

CSS tutorial: CSS Dimensión

CSS tutorial: modelo de caja CSS

Referencia CSS: width property


<Estilo de objeto