HTML DOM Style Object

Stijl object

Het Stijl object vertegenwoordigt een afzonderlijke stijlverklaring.

Stijl object eigenschap

Eigenschap Beschrijving
alignContent Instellen of retourner de uitlijning tussen rijen in de elastische container, wanneer items niet alle beschikbare ruimte gebruiken.
alignItems Instellen of retourner de uitlijning van items in de elastische container.
alignSelf Instellen of retourner de uitlijning van geselecteerde items in de elastische container.
animation De verkorte eigenschap van alle animatie-eigenschappen, behalve animationPlayState.
animationDelay Instellen of retourner wanneer de animatie moet beginnen.
animationDirection Instellen of retourner of de animatie in een alternatieve cyclus omgekeerd moet worden afgespeeld.
animationDuration Instellen of retourner het aantal seconden of milliseconden dat een cyclus van de animatie duurt.
animationFillMode Instellen of retourner de waarde die wordt toegepast buiten de uitvoeringstijd van de animatie.
animationIterationCount Instellen of retourner het aantal keren dat de animatie moet worden afgespeeld.
animationName Instellen of retourner de naam van de @keyframes animatie.
animationPlayState Instellen of retourner of de animatie draait of gepauzeerd is.
animationTimingFunction Instellen of retourner de snelheidskromme van de animatie.
background Instellen of retourner alle achtergrond-eigenschappen in één verklaring.
backgroundAttachment Instellen of retourner of de achtergrondafbeelding statisch is of met de pagina scrolt.
backgroundClip Instellen of retourner het tekeningsgebied van de achtergrond.
backgroundColor Instellen of retourner de achtergrondkleur van het element.
backgroundImage Instellen of retourner de achtergrondafbeelding van het element.
backgroundOrigin 设置或返回背景图像的定位区域。
backgroundPosition 设置或返回背景图像的起始位置。
backgroundRepeat Instellen of retourneren van het gebied waarop de achtergrondafbeelding wordt geplaatst.
backgroundPosition Instellen of retourneren van de startpositie van de achtergrondafbeelding.
backgroundRepeat Instellen of retourneren van hoe de achtergrondafbeelding wordt herhaald (tapijt).
backgroundSize Instellen of retourneren van de grootte van de achtergrondafbeelding.
backfaceVisibility Instellen of retourneren of de rand zichtbaar moet zijn wanneer het element niet naar het scherm is gericht.
borderBottom Instellen of retourneren van alle borderBottom-eigenschappen in één verklaring.
borderBottomColor Instellen of retourneren van de kleur van de onderste rand.
borderBottomLeftRadius Instellen of retourneren van de vorm van de linker onderste rand.
borderBottomRightRadius Instellen of retourneren van het stijl van de onderste rand.
borderBottomWidth Instellen of retourneren van de breedte van de onderste rand.
borderCollapse Instellen of retourneren of de tabelrand moet worden samengevoegd tot een enkele rand.
borderColor Instellen of retourneren van de kleur van de elementrand (tot maximaal vier waarden).
borderImage Korte eigenschap voor het instellen of retourneren van alle borderImage-eigenschappen.
borderImageOutset Instellen of retourneren van de hoeveelheid die de afbeeldingsrandregio overschrijdt.
borderImageRepeat Instellen of retourneren of de afbeeldingsrand herhaald, omringd of uitgerekt moet worden.
borderImageSlice Instellen of retourneren van de afstand van de afbeeldingsrand naar binnen.
borderImageSource Instellen of retourneren van de afbeelding die als rand wordt gebruikt.
borderImageWidth Instellen of retourneren van de breedte van de afbeeldingsrand.
borderLeft Instellen of retourneren van alle borderLeft-eigenschappen in één verklaring.
borderLeftColor Instellen of retourneren van de kleur van de linker rand.
borderLeftStyle Instellen of retourneren van het stijl van de linker rand.
borderLeftWidth Instellen of retourneren van de breedte van de linker rand.
borderRadius Korte eigenschap voor het instellen of retourneren van alle vier de borderRadius-eigenschappen.
borderRight Instellen of retourner alle borderRight-eigenschappen in één verklaring.
borderRightColor Instellen of retourner de kleur van de rechter rand.
borderRightStyle 设置或返回右边框的样式。
borderRightStyle Instellen of retourneren van de stijl van de rechter rand.
borderRightWidth Instellen of retourneren van de breedte van de rechter rand.
borderSpacing Instellen of retourneren van de ruimte tussen de cellen in een tabel.
borderStyle Instellen of retourneren van de stijl van de rand van het element (tot maximaal vier waarden).
borderTop Instellen of retourneren van alle borderTop-eigenschappen in één verklaring.
borderTopColor Instellen of retourneren van de kleur van de bovenste rand.
borderTopLeftRadius Instellen of retourneren van de vorm van de linkerbovenhoek.
borderTopRightRadius Instellen of retourneren van de stijl van de bovenste rand.
borderTopWidth Instellen of retourneren van de breedte van de bovenste rand.
borderWidth Instellen of retourneren van de breedte van de rand van het element (tot maximaal vier waarden).
bottom Instellen of retourneren van de onderste positie van het geplaatste element.
boxDecorationBreak Instellen of retourneren van het gedrag van de achtergrond en randen van een element bij paginering, of voor inline-elementen, bij een nieuwe regel.
boxShadow Een of meerdere schaduwen toevoegen aan een kast (box).
boxSizing Stelt u in staat om bepaalde elementen op een bepaalde manier aan een gebied aan te passen.
captionSide Instellen of retourneren van de positie van de tabelkop.
caretColor Instellen of retourneren van de kleur van de insertteken/ cursor.
clear Instellen of retourneren van de positie van het element ten opzichte van floating objecten.
clip Instellen of retourneren van welke deel van het geplaatste element zichtbaar is.
color Instellen of retourneren van de kleur van de tekst.
columnCount Instellen of retourneren van het aantal kolommen dat een element moet verdelen.
columnFill Instellen of retourneren van de manier waarop de kolommen worden gevuld.
columnGap Instellen of retourneren van de speling tussen de kolommen.
columnRule Korte eigenschap voor instellen of retourneren van alle columnRule-eigenschappen.
columnRuleColor Instellen of retourneren van de kleur van de regel tussen de kolommen.
columnRuleStyle Instellen of retourneren van de stijl van de regel tussen de kolommen.
columnRuleWidth Instellen of retourneren van de regelbreedte tussen de kolommen.
columns Korte eigenschap voor instellen of retourneren van columnWidth en columnCount.
columnSpan Instellen of retourneren van het aantal kolommen dat een element moet overspannen.
columnWidth Instellen of retourneren van de breedte van de kolom.
content Used with :before and :after pseudo-elements to insert generated content.
counterIncrement Increment one or more counters.
counterReset Create or reset one or more counters.
cursor Set or return the cursor type displayed by the mouse pointer.
direction Set or return the text direction.
display Set or return the display type of the element.
emptyCells Set or return whether the border and background of empty cells should be displayed.
filter Set or return the image filter (visual effects such as blur and saturation).
flex Set or return the length of the item, relative to the rest of the content.
flexBasis Set or return the initial length of the elastic item.
flexDirection Set or return the direction of the elastic item.
flexFlow Abbreviated properties of flexDirection and flexWrap.
flexGrow Set or return the growth amount of the item relative to other items.
flexShrink Set or return the shrinkage method of the item relative to other items.
flexWrap Set or return whether the elastic item should be wrapped.
cssFloat Set or return the horizontal alignment method of the element.
font Set or return font properties in one declaration.
fontFamily Set or return the font family of the text.
fontSize Set or return the font size of the text.
fontStyle Set or return whether the font style is normal, italic, or oblique.
fontVariant Set or return whether the font should be displayed in small capitals.
fontWeight Set or return the thickness of the font.
fontSizeAdjust Maintain the readability of the text when font fallback occurs.
fontStretch Choose the way of stretching deformation from the font family.
hangingPunctuation Specify whether punctuation can be placed outside the line box.
height Set or return the height of the element.
hyphens Set how words are split to improve the layout of the paragraph.
icon Allow the author to use iconic equivalents to set the style of the element.
imageOrientation Specify the right or clockwise rotation applied to the image by the user agent.
isolation Define whether the element must create new stacked content.
justifyContent Set or return the alignment method between items within an elastic container when not all available space is used by the items.
left Set or return the left position of the定位element.
letterSpacing Stel in of retourneer de ruimte tussen de tekens in de tekst.
lineHeight Stel in of retourneer de afstand tussen de regels in de tekst.
listStyle Stel in of retourneer de lijststijl in één verklaring.
listStyleImage Stel in of retourneer het beeld als lijstitemmarkering.
listStylePosition Stel in of retourneer de positie van de lijstitemmarkering.
listStyleType Stel in of retourneer het type van de lijstitemmarkering.
margin Stel in of retourneer de buitenrand van het element (tot maximaal vier waarden).
marginBottom Stel in of retourneer de onderste buitenrand van het element.
marginLeft Stel in of retourneer de linker buitenrand van het element.
marginRight Stel in of retourneer de rechter buitenrand van het element.
marginTop Stel in of retourneer de bovenste buitenrand van het element.
maxHeight Stel in of retourneer de maximale hoogte van het element.
maxWidth Stel in of retourneer de maximale breedte van het element.
minHeight Stel in of retourneer de minimale hoogte van het element.
minWidth Stel in of retourneer de minimale breedte van het element.
navDown Stel in of retourneer de navigatiepositie bij het gebruik van de navigatiepijl omlaag.
navIndex Stel in of retourneer de volgorde van het element voor het springen.
navLeft Stel in of retourneer de navigatiepositie bij het gebruik van de navigatiepijl naar links.
navRight Stel in of retourneer de navigatiepositie bij het gebruik van de navigatiepijl naar rechts.
navUp Stel in of retourneer de navigatiepositie bij het gebruik van de navigatiepijl omhoog.
objectFit Specificeer hoe de inhoud van het vervangen element moet worden aangepast om in het frame te passen dat is opgesteld met de gebruikte hoogte en breedte.
objectPosition Specificeer de uitlijning van het vervangen element binnen het frame.
opacity Stel in of retourneer het mate van doorzichtigheid van het element.
order Stel in of retourneer de volgorde van het elastische item ten opzichte van de andere items.
orphans Stel in of retourneer het minimale aantal regels dat moet blijven op de onderste pagina van de pagina wanneer er wordt gepaginereerd binnen het element.
outline Stel in of retourneer alle outline-eigenschappen in één verklaring.
outlineColor Stel in of retourneer de kleur van de rand van het element.
outlineOffset Verschuif de rand van het outline en teken deze buiten de rand van het frame.
outlineStyle Stel in of retourneer de stijl van de rand van het element.
outlineWidth Stel in of retourneer de breedte van de rand van het element.
overflow Stel in of retourneer hoe de inhoud die buiten het elementframe wordt weergegeven, wordt afgehandeld.
overflowX Regel hoe de linker/rechter rand van de inhoud wordt afgehandeld als deze de inhoudsgebied van het element overschrijdt.
overflowY Bepalen hoe de bovengrens of ondergrens van de inhoud wordt afgehandeld, als deze de inhoudsgebied van het element overschrijdt.
padding Instellen of retourneren van de binnenmarge van het element (tot maximaal vier waarden).
paddingBottom Instellen of retourneren van de onderste binnenmarge van het element.
paddingLeft Instellen of retourneren van de linker binnenmarge van het element.
paddingRight Instellen of retourneren van de rechter binnenmarge van het element.
paddingTop Instellen of retourneren van de bovenste binnenmarge van het element.
pageBreakAfter Instellen of retourneren van het paginabeheer achter het element.
pageBreakBefore Instellen of retourneren van het paginabeheer voor het element.
pageBreakInside Instellen of retourneren van het paginabeheer binnen het element.
perspective Instellen of retourneren van hoe de kijkhoek van een 3D-element wordt bekeken.
perspectiveOrigin Instellen of retourneren van de onderste positie van een 3D-element.
position Instellen of retourneren van het type van de locatiemethode voor het element (statisch, relatief, absoluut of vast).
quotes Instellen of retourneren van het type aanhalingstekens van ingesloten aanhalingstekens.
resize Instellen of retourneren van of het element kan worden aangepast in grootte door de gebruiker.
right Instellen of retourneren van de rechter positie van het element.
scrollBehavior Bepalen of er een animatie van soepele scroll定位 wordt weergegeven wanneer de gebruiker op een link in een scrollbalk klikt, in plaats van direct te springen.
tableLayout Instellen of retourneren van de lay-out van de tabelcellen, rijen en kolommen.
tabSize Instellen of retourneren van de lengte van de tabtoets.
textAlign Instellen of retourneren van de horizontale uitlijning van de tekst.
textAlignLast Instellen of retourneren van hoe de laatste regel van een blok of een forcerende nieuwe regel wordt uitgelijnd wanneer text-align op "justify" is ingesteld.
textDecoration Instellen of retourneren van de tekstdecoratie.
textDecorationColor Instellen of retourneren van de kleur van de tekstdecoratie.
textDecorationLine Instellen of retourneren van het type lijn in de tekstdecoratie.
textDecorationStyle Instellen of retourneren van het type lijnstijl in de tekstdecoratie.
textIndent Instellen of retourneren van de inspringing van de eerste regel van de tekst.
textJustify Instellen of retourneren van de uitlijning die wordt gebruikt wanneer text-align op "justify" is ingesteld.
textOverflow Instellen of retourneren van wat er moet gebeuren wanneer de tekst de inhoud van het element overschrijdt.
textShadow Instellen of retourneren van het schaduweffect van de tekst.
textTransform Instellen of retourneren van de tekstgrootte van de tekst.
top Instellen of retourneren van de toppositie van het geplaatste element.
transform Toepassen van een 2D- of 3D-transformatie op het element.
transformOrigin Instellen of retourneren van de positie van het geconverteerde element.
transformStyle Instellen of retourneren van de rendering van ingesloten elementen in de 3D-ruimte.
transition Gebruikt om een afkortingseigenschap in te stellen of te retourneren voor de vier transformatie-eigenschappen.
transitionProperty Instellen of retourneren van de CSS-eigenschappen van het overgangseffect.
transitionDuration Instellen of retourneren van het aantal seconden of milliseconden dat het overgangseffect nodig heeft om te voltooien.
transitionTimingFunction Instellen of retourneren van de snelheidscurve van het overgangseffect.
transitionDelay Instellen of retourneren van wanneer de overgangseffecten beginnen.
unicodeBidi Instellen of retourneren van of tekst moet worden overgemaakt om meerdere talen in hetzelfde document te ondersteunen.
userSelect Instellen of retourneren van of de tekst van het element kan worden geselecteerd.
verticalAlign Instellen of retourneren van de verticale uitlijning van de inhoud van het element.
visibility Instellen of retourneren van of een element zichtbaar is.
whiteSpace Instellen of retourneren van hoe tabуляtors, regeleindes en spaties in de tekst worden afgehandeld.
width Instellen of retourneren van de breedte van het element.
wordBreak Instellen of retourneren van de regelsbreukregels voor niet-CJK-schriften.
wordSpacing Instellen of retourneren van de woordafstand in de tekst.
wordWrap Laat lange, onbreekbare woorden breken en overgaan naar de volgende regel.
widows Instellen of retourneren van het minimale aantal regels dat een element moet hebben om bovenop de pagina zichtbaar te zijn.
zIndex Instellen of retourneren van de stapelvolgorde van geplaatste elementen.

Toegang tot het Style-object

Het stijlobject kan worden bereikt vanuit het head-deel van de document of een specifiek HTML-element.

Voorbeeld 1

Toegang tot het stijlobject van het head-deel van de document:

var x = document.getElementsByTagName("STYLE");

Probeer het zelf

Voorbeeld 2

Toegang tot het stijlobject van een specifiek element verkrijgen:

var x = document.getElementById("myH1").style;

Probeer het zelf

Maak een Style-object aan

Voorbeeld 1

U kunt de methode document.createElement() gebruiken om een <style>-element te maken:

var x = document.createElement("STYLE");

Probeer het zelf

Voorbeeld 2

U kunt ook de stijleigenschappen van bestaande elementen instellen:

document.getElementById("myH1").style.color = "red";

Probeer het zelf

Gerelateerde pagina's

HTML Handleiding:HTML CSS

CSS Handleiding:CSS Handleiding

HTML Referentiemanual:HTML <style> tag

CSS Referentiemanual:CSS Eigenschappen