JavaScript 如何動態加入 CSS 樣式到網頁？

使用 JavaScript 動態添加 CSS 樣式

透過 JavaScript 動態添加 CSS 規則的能力是修改 CSS 視覺外觀的強大技術。動態網頁。一種常見的方法是建立一個新的樣式元素並將其附加到文件頭。

// 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)

此程式碼建立一個新的樣式元素並將其文字內容設定為提供的 CSS 樣式。接下來，它將樣式元素附加到文件的頭部，這確保立即套用樣式。

以上是JavaScript 如何動態加入 CSS 樣式到網頁？的詳細內容。更多資訊請關注PHP中文網其他相關文章！