css+js实现支持亮色暗色黑色主题切换的菜单效果代码-html代码-BFW代码库

css+js实现支持亮色暗色黑色主题切换的菜单效果代码

代码语言：html

代码描述：css+js实现支持亮色暗色黑色主题切换的菜单效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">



    <style>
        @import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap");
        *,
        *:after,
        *:before {
          box-sizing: border-box;
        }
        
        :root {
          --c-text-primary: #191919;
          --c-text-secondary: #737374;
          --c-border-primary: #ccc;
          --c-bg-body: #ccc;
          --c-bg-primary: #fff;
          --c-bg-secondary: #d4d8dd;
          --c-bg-button: #fff;
          --slider-shadow: inset 0 1px 1px #ddd, 0 2px 3px #ccc;
        }
        :root.dark-theme {
          --c-text-primary: #eee;
          --c-text-secondary: #d3d5db;
          --c-border-primary: #454545;
          --c-bg-primary: #323339;
          --c-bg-secondary: #222128;
          --c-bg-button: #494a50;
          --slider-shadow: inset 0 1px 1px #767676;
        }
        :root.black-theme {
          --c-text-primary: #edeeef;
          --c-text-secondary: #d4d7e1;
          --c-border-primary: #323232;
      .........完整代码请登录后点击上方下载按钮下载查看