引導文檔顯示了如何啟用黑暗模式:
<html lang="en" data-bs-theme="dark">
<head>
<link rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
</head>
<body>
<h1>Hello, world!</h1>
</body>
</html>如果您檢查docs頁面上的元素，您會從該站點的自定義樣式表中看到以下內容:
.bd-content>h2,.bd-content>h3,.bd-content>h4 {
--bs-heading-color: var(--bs-emphasis-color)
}如果您然后單擊- bs-emphasis-color自定義屬性，您會看到它是在_root.scss中設置的:
--bs-emphasis-color: #fff;同樣，您可以在自定義樣式表中覆蓋自定義屬性。這里我在body元素上使用了一個類來提供足夠的選擇器細節。我還利用現有的強調顏色屬性變量來保持動態(理論上更容易維護)。
[data-bs-theme=dark] .brighter {
--bs-heading-color: var(--bs-emphasis-color);
}<html lang="en" data-bs-theme="dark">
<head>
<link rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
</head>
<body class="brighter">
<h1>Hello, world!</h1>
</body>
</html>上一篇python 自動點廣告
下一篇python 自動更新