javascript stijl attributen
alle javascript equivalenten van de css-tegenhangers

home | index | menu | help

Er is geen CSS ondersteuning.



		

javascript stijl attributen

achtergrond- & kleur-eigenschappen

css-naamjavascript naamomschrijvingmogelijke waardentypejavascript-voorbeeldcss-voorbeelderft
background-colorbackgroundColorbepaal de achtergrond kleurnaam of waarde van de kleuralle elementenp.style.backgroundColor = '#020'{background-color: #002200}nee
colorcolorbepaal de element kleurnaam of waarde van de kleuralle elementenp.style.color = '#ddd'{color:silver}ja

font eigenschappen

css-naamjavascript naamomschrijvingmogelijke waardentypejavascript-voorbeeldcss-voorbeelderft
font-familyfontFamilydefinieer font familyfamily namealle elementenp.style.fontFamily = 'ariel roman'{font-family: ariel roman}ja
font-stylefontStyledefinieer font stylenormal, italic, obliquealle elementenp.style.fontStyle = 'italic' {font-style: italic}ja
font-variantfontVariantbepaal of het font standaard is of small capsnormal, small-capsalle elementenp.style.fontVariant = 'small-caps' {font-variant: small-caps}ja
font-weightfontWeightbepaal de dikte van het fontnormal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900alle elementenp.style.fontWeight = 'bolder' {font-weight: 600}ja

list stijl

css-naamjavascript naamomschrijvingmogelijke waardentypejavascript-voorbeeldcss-voorbeelderft
list-stylelistStylebepaal van  list style het type en/of de positie none, circle, disc, square, armenian, decimal-leading-zero, decimal, georgian, lower-alpha, lower-greek, lower-latin, lower-roman, upper-alpha, upper-latin, upper-roman, inheritlist-itemobject.style.listStyle = 'none' {list-style: circle}ja

margins

css-naamjavascript naamomschrijvingmogelijke waardentypejavascript-voorbeeldcss-voorbeelderft
margin-bottommarginBottombepaal van element de bottom marginlengte, waarde of procentalle elementenobject.style.marginBottom='12px'{margin-bottom:2em}nee
margin-leftmarginLeftbepaal van element de left marginlengte, waarde of procentalle elementenobject.style.marginLeft='12px'{margin-left:2em}nee
margin-rightmarginRightbepaal van element de right marginlengte, waarde of procentalle elementenobject.style.marginRight='12px'{margin-right:2em}nee
margin-topmarginTopbepaal van element de top marginlengte, waarde of procentalle elementenobject.style.marginTop='12px'{margin-top:2em}nee

tekst eigenschappen

css-naamjavascript naamomschrijvingmogelijke waardentypejavascript-voorbeeldcss-voorbeelderft
line-heightlineHeightzet de lijnhoogtenormal,een getal of een percentage van de font-size van het elementalle elementenobject.style.lineHeight='2'{line-height: 2}ja
text-aligntextAlignbepaal de uitlijning van de tekstleft, right, center, justifyblockobject.style.textAlign='right'{text-align: center}ja
text-decorationtextDecorationSets the special decoration attributes of text.none, overline, underline, line-through, blinkalle elementenobject.style.textDecoration='none'{text-decoration: none}nee
text-indenttextIndentbepaal de inspringinging van de eerste regellengte of percentageblockp.style.textIndent='5px'{text-indent: 5%}ja
text-transformtextTransformverander de tekst in een andere waardenone, capitalize, uppercase, lowercasealle elementenp.style.textTransform='uppercase'{text-transform: uppercase}ja
vertical-alignverticalAlignbepaal verticale positiebaseline, sub. super, top, middle, bottom, text-top, text-bottom, of een percentageinlinep.style.verticalAlign='top' {vertical-align: sub}nee


		

Natuurlijk ken je de javascript-versie van css-statements. Maar voor de mensen die dit niet dagelijks gebruiken is dit een handige tabel. Helemaal links op de tabel staat een css-statement, en gelijk rechts daarvan staat de javascript-variant (zoals je die in scripts kan gebruiken). Zowel voor het javascript als voor de CSS is er een klein voorbeeldje bijgevoegd.

cache 18-09-2010