Ce post va faire un bref recapitulatif des equivalent javascript des propriétés CSS. C’est en fait un re-post d’un ancien article, mais il semble être très demandé.
Pour rappel, afin de modifier le style d’un tag ayant comme id myElement il faut utiliser la syntaxe suivante :
document.getElementById(myElement).style.border = 1px solid black;
Javascript | Css |
textDecoration | text-decoration |
textDecorationLineThrough | text-decoration: line-through |
textDecorationNone | text-decoration: none |
textDecorationUnderline | text-decoration: underline |
textDecorationOverline | text-decoration: overline |
textIndent | text-indent |
textTransform | text-transform |
styleFloat | float |
listStyle | list-style |
listStyleImage | list-style-image |
listStylePosition | list-style-position |
listStyleType | list-style-type |
paddingBottom | padding-bottom |
paddingLeft | padding-left |
paddingRight | padding-right |
paddingTop | padding-top |
pageBreakAfter | page-break-after |
pageBreakBefore | page-break-before |
font-family | fontFamily |
font-size | fontSize |
font-weight | fontWeight |
font-variant | fontVariant |
borderBottom | border-bottom |
borderBottomColor | border-bottom-color |
borderBottomStyle | border-bottom-style |
borderBottomWidth | border-bottom-width |
borderColor | border-color |
borderLeft | border-left |
borderLeftColor | border-left-color |
borderLeftStyle | border-left-style |
borderLeftWidth | border-left-width |
borderRight | border-right |
borderRightColor | border-right-color |
borderRightStyle | border-right-style |
borderRightWidth | border-right-width |
borderStyle | border-style |
borderTop | border-top |
borderTopColor | border-top-color |
borderTopStyle | border-top-style |
borderTopWidth | border-top-width |
borderWidth | border-width |
marginBottom | margin-bottom |
marginLeft | margin-left |
marginRight | margin-right |
marginTop | margin-top |
lineHeight | line-height |
letterSpacing | letter-spacing |
verticalAlign | vertical-align |
zIndex | z-index |
backgroundAttachment | background-attachment |
backgroundColor | background-color |
backgroundImage | background-image |
backgroundPosition | background-position |
backgroundRepeat | background-repeat |
Les propriétés CSS composées d’un seul mot ont un equivalent en javascript.
Liens utiles :
[…] A garder sous la main pour pouvoir modifier les CSS avec du javascript. […]