Stijlbreedte Eigenschap _
Voorbeeld
Stel de breedte van een <button> element in:
document.getElementById("myBtn").style.width = "300px";
Definitie en gebruik
De eigenschap width bepaalt of retourneert de breedte van een element.
De eigenschap width heeft alleen effect op elementen op blokniveau of op elementen met een absolute of vaste positie. De overlopende inhoud kan worden gemanipuleerd met de eigenschap overloop.
Tip: gebruik de eigenschap height om de hoogte van een element in te stellen of te retourneren.
Browserondersteuning
Property | |||||
---|---|---|---|---|---|
width | Yes | Yes | Yes | Yes | Yes |
Syntaxis
Retourneer de eigenschap width:
object.style.width
Stel de eigenschap width in:
object.style.width = "auto|length|%|initial|inherit"
Eigendomswaarden
Value | Description |
---|---|
auto | The browser sets the width. This is default |
length | Defines the width in length units |
% | Defines the width in % of the parent element |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Technische details
Standaardwaarde: | auto |
---|---|
Winstwaarde: | Een String, die de breedte van een element vertegenwoordigt |
CSS-versie | CSS1 |
Meer voorbeelden
Voorbeeld
Verander de breedte van een <div> element:
document.getElementById("myDIV").style.width = "500px";
Voorbeeld
Verander de hoogte en breedte van een <img> element:
document.getElementById("myImg").style.height = "300px";
document.getElementById("myImg").style.width = "300px";
Voorbeeld
Retourneer de breedte van een <img> element:
alert(document.getElementById("myImg").style.width);
Gerelateerde pagina's
CSS-zelfstudie: CSS-dimensie
CSS-zelfstudie: CSS Box-model
CSS-referentie: eigenschap width
❮ Stijlobject