导航栏

导航栏深色

复制


<导航
  类=“导航栏 导航栏-扩展-lg 导航栏-深色 bg-渐变-深色 z-index-3 py-3”>
   类=“容器”>
    <一 类=“导航栏品牌文字白色” 链接="https://demos.creative-tim.com/material-kit/presentation" 相对=“工具提示” 标题=“由创意蒂姆设计和编码” 数据放置=“底部” 目标=“_空白”>
      材料套件2
    
    <一 链接="https://www.creative-tim.com/product/material-design-system-pro#pricingCard" 类=“btn btn-sm bg-梯度-主 btn-round mb-0 ms-auto d-lg-无 d-block”>立即购买
    <按钮 类=“导航栏切换器阴影无 MS-2” 类型=“按钮” 数据-bs-切换=“崩溃” 数据-bs-目标=“#导航” 咏叹调控制=“导航” 咏叹调扩展=“假” 咏叹调标签=“切换导航”>
      <跨度 类=“导航栏切换器图标 mt-2”>
        <跨度 类=“导航栏切换栏 bar1”>
        <跨度 类=“导航栏切换栏 bar2”>
        <跨度 类=“导航栏切换栏 bar3”>
      
    
     类=“折叠导航栏-折叠 w-100 pt-3 pb-2 py-lg-0” 编号=“导航”>
       类=“导航栏-导航 导航栏-导航-悬停 mx-自动”>
        <李 类=“导航项目 MX-2”>
          <一 类=“nav-link ps-2 d-flex justify-content-after 光标指针对齐项目中心” 角色=“按钮”>
            页面
            <图片 源="../../assets/img/down-arrow-white.svg" 替代=“向下箭头” 类=“箭头MS-1”>
          
        

        <李 类=“导航项目 MX-2”>
          <一 类=“nav-link ps-2 d-flex justify-content-after 光标指针对齐项目中心” 角色=“按钮”>
            账户
            <图片 源="../../assets/img/down-arrow-white.svg" 替代=“向下箭头” 类=“箭头MS-1”>
          
        
        <李 类=“导航项目 MX-2”>
          <一 类=“nav-link ps-2 d-flex justify-content-after 光标指针对齐项目中心” 角色=“按钮”>
            积木
            <图片 源="../../assets/img/down-arrow-white.svg" 替代=“向下箭头” 类=“箭头MS-1”>
          
        

        <李 类=“导航项下拉下拉菜单悬停 mx-2”>
          <一 类=“nav-link ps-2 d-flex justify-content-after 光标指针对齐项目中心” 角色=“按钮”>
            文档
            <图片 源="../../assets/img/down-arrow-white.svg" 替代=“向下箭头” 类=“箭头MS-1”>
          
        
      

       类=“导航栏-导航 d-lg-块 d-无”>
        <李 类=“导航项目”>
          <一 链接="https://www.creative-tim.com/product/material-design-system-pro#pricingCard" 类=“btn btn-sm bg-梯度-主 mb-0 me-1” 角色=“按钮”>立即购买
        
      
    

导航栏灯

截图
导航栏-2

导航栏透明

截图
导航栏-3

导航栏模糊

截图
导航栏-4