CSS開燈關燈是一種常用的功能，它可以讓網站頁面在不同的模式下展示不同的樣式效果。下面我們來介紹如何使用CSS實現開關燈的效果。
CSS開燈關燈效果
這是一個演示開關燈效果的頁面
上面的代碼中，我們定義了兩種不同的樣式，分別是.container和.container.dark-mode，通過JavaScript代碼動態的添加或移除.dark-mode類名來切換樣式。同時，我們也定義了兩種不同的按鈕樣式，分別是.btn和.btn.dark-mode，同樣是通過添加或移除.dark-mode類名來切換樣式。最后，我們使用JavaScript代碼來實現點擊按鈕切換樣式和文本。
需要注意的是，在支持CSS的瀏覽器中，開關燈效果是不需要使用JavaScript代碼的，只需要在按鈕的onclick事件中添加切換樣式的語句即可。但是，在一些瀏覽器中可能存在不支持的情況，所以我們最好使用JavaScript來實現。
上一篇css 底部永久懸浮
下一篇mySQL電子工業出版社