JavaScript définit et modifie les styles CSS

Syntaxe :
nodeObject.style.cssProperty=newStyle
Où, nodeObject est l'objet nœud, cssProperty est la propriété CSS et newStyle est la valeur de la propriété CSS.

Remarque : Pour les propriétés CSS séparées par "-", supprimez le "-" et mettez en majuscule la première lettre après le "-".

Par exemple :

document.getElementById("demo").style.height = "50px" ;
document.getElementById("demo").style.border = " 1px solid #ddd ";
document.getElementById("demo").style.backgroundColor = " #ccc ";
document.getElementById("demo").style.textAlign = " center ";

Par exemple, définissez le style du nœud avec id="demo":

<style>
#demo{
    height:50px;
    width:250px;
    margin-top:10px;
    text-align:center;
    line-height:50px;
    background-color:#ccc;
    }
</style>
<div id="demo">
    点击这里改变CSS样式
</div>
<script type="text/javascript">
    document.getElementById("demo").onclick=function(){
        this.style.height = " 70px ";
        this.style.lineHeight = " 70px ";
        this.style.backgroundColor = " #000 ";
        this.style.color=" #fff ";
    }
</script>