Comment JavaScript peut-il ajouter dynamiquement des styles CSS à une page Web ?

Ajout dynamique de styles CSS avec JavaScript

La possibilité d'ajouter dynamiquement des règles CSS via JavaScript est une technique puissante pour modifier l'apparence visuelle d'un page Web à la volée. Une approche courante consiste à créer un nouvel élément de style et à l'ajouter à l'en-tête du document.

// Your CSS as text
var styles = `
    .qwebirc-qui .ircwindow div { 
        font-family: Georgia,Cambria,"Times New Roman",Times,serif;
        margin: 26px auto 0 auto;
        max-width: 650px;
    }
    .qwebirc-qui .lines {
        font-size: 18px;
        line-height: 1.58;
        letter-spacing: -.004em;
    }
    
    .qwebirc-qui .nicklist a {
        margin: 6px;
    }
`

var styleSheet = document.createElement("style")
styleSheet.textContent = styles
document.head.appendChild(styleSheet)

Ce code crée un nouvel élément de style et définit son contenu de texte selon les styles CSS fournis. Ensuite, il ajoute l'élément de style à l'en-tête du document, ce qui garantit que les styles sont appliqués immédiatement.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!