【Bootstrap V4系列】学习入门教程之 组件-导航条（Navbar）

news2025/5/16 11:08:42

Bootstrap V4系列 学习入门教程之 组件-导航条（Navbar）

  • 导航条（Navbar）
    • 一、How it works
    • 二、Supported content 支持的内容
      • 2.1 Brand 品牌
      • 2.2 Nav 导航
      • 2.3 Forms 表格
    • 三、Color schemes 配色方案
    • 四、Containers 容器
    • 五、Placement 放置方式
    • 六、Responsive behaviors 响应式行为

导航条（Navbar）

Bootstrap功能强大、响应迅速的导航头navbar的文档和示例。包括对品牌、导航、折叠插件等的支持。

一、How it works

在开始使用导航栏之前，您需要了解以下内容：

  • 导航栏需要一个带有.navbar-expand{-sm|-md|-lg|-xl}的.navbar包装，用于响应式折叠和配色方案类。
  • 默认情况下，导航栏及其内容是流畅的。使用可选容器来限制其水平宽度。
  • 使用我们的间距和flex实用程序类来控制导航栏中的间距和对齐。
  • 默认情况下，导航栏是响应式的，但您可以轻松修改它们以更改这一点。响应行为取决于我们的Collapse JavaScript插件。
  • 默认情况下，打印时导航栏隐藏。通过在.navbar中添加.d-print来强制打印它们。请参见显示实用程序类。
  • 使用<nav>元素确保可访问性，或者，如果使用更通用的元素，如<div>，则在每个导航栏中添加role=“navigation”，以明确地将其标识为辅助技术用户的地标区域。

二、Supported content 支持的内容

导航栏内置了对少数子组件的支持。根据需要从以下选项中选择：

  • .navbar-brand 品牌代表您的公司、产品或项目名称。
  • .navbar-nav 导航用于全高和轻量级导航（包括支持下拉）。
  • .navbar-toggler 切换器，用于我们的折叠插件和其他导航切换行为。
  • .form-inline 内联用于任何表单控件和操作。
  • .navbar-text 文本，用于添加垂直居中的文本字符串。
  • .collapse.navbar-collapse用于按父断点对导航栏内容进行分组和隐藏。

这是一个包含在响应式灯光主题导航栏中的所有子组件的示例，该导航栏在lg（large）断点处自动折叠。

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-expanded="false">
          Dropdown
        </a>
        <div class="dropdown-menu">
          <a class="dropdown-item" href="#">Action</a>
          <a class="dropdown-item" href="#">Another action</a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="#">Something else here</a>
        </div>
      </li>
      <li class="nav-item">
        <a class="nav-link disabled">Disabled</a>
      </li>
    </ul>
    <form class="form-inline my-2 my-lg-0">
      <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
      <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
    </form>
  </div>
</nav>

页面展示效果：

在这里插入图片描述

2.1 Brand 品牌

.navbar-brand 品牌可以应用于大多数元素，但锚点效果最好，因为一些元素可能需要实用类或自定义样式。

<!-- As a link -->
<nav class="navbar navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
</nav>

<!-- As a heading -->
<nav class="navbar navbar-light bg-light">
  <span class="navbar-brand mb-0 h1">Navbar</span>
</nav>

页面展示效果：

在这里插入图片描述

<!-- Image and text -->
<nav class="navbar navbar-light bg-light">
  <a class="navbar-brand" href="#">
    <img src="/docs/4.6/assets/brand/bootstrap-solid.svg" width="30" height="30" class="d-inline-block align-top" alt="">
    Bootstrap
  </a>
</nav>

页面展示效果：

在这里插入图片描述

2.2 Nav 导航

导航栏导航链接基于我们的.nav选项，具有自己的修饰符类，需要使用切换类来实现适当的响应样式。导航栏中的导航也将增长到占用尽可能多的水平空间，以保持导航栏内容的安全对齐。

活动状态（带有.Active）表示当前页面可以直接应用于.nav-links 链接或其直接父级.nav-items项目。

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNav">
    <ul class="navbar-nav">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Features</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Pricing</a>
      </li>
      <li class="nav-item">
        <a class="nav-link disabled">Disabled</a>
      </li>
    </ul>
  </div>
</nav>

页面展示效果：

在这里插入图片描述

由于我们使用类进行导航，如果你愿意，你可以完全避免基于列表的方法。

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
    <div class="navbar-nav">
      <a class="nav-link active" href="#">Home <span class="sr-only">(current)</span></a>
      <a class="nav-link" href="#">Features</a>
      <a class="nav-link" href="#">Pricing</a>
      <a class="nav-link disabled">Disabled</a>
    </div>
  </div>
</nav>

页面展示效果：

在这里插入图片描述

您还可以在导航栏中使用下拉菜单。下拉菜单需要一个包装元素来定位，因此请确保为.nav-item 项目和.nav-link 链接使用单独的嵌套元素，如下所示。

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNavDropdown">
    <ul class="navbar-nav">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Features</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Pricing</a>
      </li>
      <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-expanded="false">
          Dropdown link
        </a>
        <div class="dropdown-menu">
          <a class="dropdown-item" href="#">Action</a>
          <a class="dropdown-item" href="#">Another action</a>
          <a class="dropdown-item" href="#">Something else here</a>
        </div>
      </li>
    </ul>
  </div>
</nav>

页面展示效果：

在这里插入图片描述

2.3 Forms 表格

将各种窗体控件和组件放置在带有.form-inline内联的导航栏中。

<nav class="navbar navbar-light bg-light">
  <form class="form-inline">
    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
    <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
  </form>
</nav>

页面展示效果：

在这里插入图片描述

.navbar的直接子元素使用灵活布局，并将默认为justify-content: space-between。根据需要使用其他flex实用程序来调整此行为。

<nav class="navbar navbar-light bg-light">
  <a class="navbar-brand">Navbar</a>
  <form class="form-inline">
    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
    <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
  </form>
</nav>

页面展示效果：

在这里插入图片描述

输入组也起作用：

<nav class="navbar navbar-light bg-light">
  <form class="form-inline">
    <div class="input-group">
      <div class="input-group-prepend">
        <span class="input-group-text" id="basic-addon1">@</span>
      </div>
      <input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1">
    </div>
  </form>
</nav>

页面展示效果：

在这里插入图片描述

三、Color schemes 配色方案

由于主题类和背景颜色实用程序的结合，导航栏的主题化从未如此简单。从.navbar-light中选择用于浅色背景的颜色，或.navbar-dark用于深色背景的颜色。然后，使用.bg-*实用程序进行自定义。

<nav class="navbar navbar-dark bg-dark">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-dark bg-primary">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-light" style="background-color: #e3f2fd;">
  <!-- Navbar content -->
</nav>

页面展示效果：

在这里插入图片描述

四、Containers 容器

虽然这不是必需的，但您可以将导航栏包裹在.container中，使其位于页面的中心。或者，您可以在.navbar中添加一个容器，仅将固定或静态顶部导航栏的内容居中。

<div class="container bg-primary">
    <nav class="navbar navbar-expand-lg navbar-light bg-secondary">
        <a class="navbar-brand" href="#">Navbar</a>
    </nav>
</div>

页面展示效果：

在这里插入图片描述

<nav class="navbar navbar-expand-lg navbar-light bg-secondary">
    <div class="container bg-primary">
        <a class="navbar-brand" href="#">Navbar</a>
    </div>
</nav>

页面展示效果：

在这里插入图片描述

五、Placement 放置方式

使用我们的位置实用程序将导航栏放置在非静态位置。从固定到顶部、固定到底部或粘贴到顶部（随页面滚动直到到达顶部，然后保持在那里）中进行选择。固定导航栏使用position:Fixed，这意味着它们是从DOM的正常流中提取的，可能需要自定义CSS（例如，在上填充顶部）来防止与其他元素重叠。

另请注意，.tick-top使用position:sticky，并非每个浏览器都完全支持它。

<nav class="navbar navbar-light bg-light">
  <a class="navbar-brand" href="#">Default</a>
</nav>

默认的，页面展示效果：

在这里插入图片描述

<nav class="navbar fixed-top navbar-light bg-light">
  <a class="navbar-brand" href="#">Fixed top</a>
</nav>

固定到顶部，页面展示效果：

在这里插入图片描述

<nav class="navbar fixed-bottom navbar-light bg-light">
  <a class="navbar-brand" href="#">Fixed bottom</a>
</nav>

固定到底部，页面展示效果：

在这里插入图片描述

<nav class="navbar sticky-top navbar-light bg-light">
  <a class="navbar-brand" href="#">Sticky top</a>
</nav>

粘贴到顶部，页面展示效果：

在这里插入图片描述

六、Responsive behaviors 响应式行为

默认情况下，导航栏开关是左对齐的，但如果它们跟在像.navbar-brand这样的兄弟元素后面，它们将自动对齐到最右侧。反转标记将反转触发器的位置。以下是不同切换样式的示例。

最小断点处未显示.navbar-brand：

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo01" aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarTogglerDemo01">
    <a class="navbar-brand" href="#">Hidden brand</a>
    <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item">
        <a class="nav-link disabled">Disabled</a>
      </li>
    </ul>
    <form class="form-inline my-2 my-lg-0">
      <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
      <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
    </form>
  </div>
</nav>

页面展示效果：

在这里插入图片描述

随着浏览器窗口变化，页面展示效果：

在这里插入图片描述

左侧显示品牌名称，右侧显示开关：

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
    <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item">
        <a class="nav-link disabled">Disabled</a>
      </li>
    </ul>
    <form class="form-inline my-2 my-lg-0">
      <input class="form-control mr-sm-2" type="search" placeholder="Search">
      <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
    </form>
  </div>
</nav>

页面展示效果：

在这里插入图片描述
随着浏览器窗口变化，页面展示效果：

在这里插入图片描述

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/2375831.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

[Java实战]Spring Security 添加验证码（二十三）

[Java实战]Spring Security 添加验证码（二十三）

[Java实战]Spring Security 添加验证码&#xff08;二十三&#xff09; 在现代的 Web 应用中&#xff0c;验证码是防止恶意攻击&#xff08;如暴力破解、自动注册等&#xff09;的重要手段之一。Spring Security 是一个功能强大的安全框架&#xff0c;提供了用户认证、授权等功…
阅读更多...
万文c++继承

万文c++继承

1、继承的概念与定义 1.1继承的概念 继承&#xff1a;是c代码复用的手段&#xff0c;允许在原有的基础上扩展&#xff0c;在此之前都是函数层次的复用&#xff0c;继承是类设计层次的复用。 下面有两个类Student和Teacher都有姓名/地址/电话/年龄等成员变量。都有identity身…
阅读更多...
Linux grep -r 查找依赖包是否存在依赖类 Class

Linux grep -r 查找依赖包是否存在依赖类 Class

方法一&#xff1a;通过 Linux &#xff0c;grep -r ClassPath 命令 grep -f org.apache.kafka.connect.source.SourceRecord在 jar 包所在 lib 或者 lib/plugins 目录下执行&#xff0c;grep -r&#xff0c; flink-sql-connector-sqlserver-cdc-3.3.0.jar 中此 kafka Source…
阅读更多...
41：像素坐标与实际坐标转化

41：像素坐标与实际坐标转化

采用上面的算子 将像素坐标点转换为实际坐标 image_points_to_world_plane(CamParam, Worldpose, Row, Column, m, X, Y) 第一个参数&#xff1a;标定得到的内参--根据标定助手得到的 第二个参数&#xff1a;标定得到的外参--根据标定助手得到的 第三个参数&#xff1a;计算…
阅读更多...
大某麦演唱会门票如何自动抢

大某麦演唱会门票如何自动抢

引言 仅供学习研究&#xff0c;欢迎交流 抢票难&#xff0c;难于上青天&#xff01;无论是演唱会、话剧还是体育赛事&#xff0c;大麦网的票总是秒光。大麦网是国内知名的票务平台&#xff0c;热门演出票往往一票难求。手动抢票不仅耗时&#xff0c;还容易错过机会。作为一名…
阅读更多...
LVS负载均衡群集和keepalive

LVS负载均衡群集和keepalive

目录 一. 集群概述 1.1 集群的定义 1.2 集群的分类 1. 高可用集群 HA 2. 高性能运输群集 HPC 3.负载均衡群集 LB 4. 分布式存储集群 二. LVS概述 2.1 LVS的定义 2.2 LVS的工作原理 2.3 LVS 的三种工作模式 2.4 LVS 三种工作模式的对比 2.5 LVS 调度算法 1. 静态…
阅读更多...
Apache Pulsar 消息、流、存储的融合

Apache Pulsar 消息、流、存储的融合

Apache Pulsar 消息、流、存储的融合 消息队列在大层面有两种不同类型的应用&#xff0c;一种是在线系统的message queue&#xff0c;一种是流计算&#xff0c;data pipeline的streaming高throughout&#xff0c;一致性较低&#xff0c;延迟较差的过程。 存算分离 扩容和缩容快…
阅读更多...
最优化方法Python计算：有约束优化应用——线性可分问题支持向量机

最优化方法Python计算：有约束优化应用——线性可分问题支持向量机

设问题的数据样本点 ( x i , y i ) (\boldsymbol{x}_i,y_i) (xi​,yi​)&#xff0c; x i ∈ R n \boldsymbol{x}_i\in\text{R}^n xi​∈Rn&#xff0c; y i 1 y_i\pm1 yi​1&#xff0c; i 1 , 2 , ⋯ , m i1,2,\cdots,m i1,2,⋯,m。由于标签数据 y i ∈ { − 1 , 1 } y_i\…
阅读更多...
SpringBoot学习(上) , SpringBoot项目的创建(IDEA2024版本)

SpringBoot学习(上) , SpringBoot项目的创建(IDEA2024版本)

目录 1. SpringBoot介绍 SpringBoot特点 2. SpringBoot入门 2.1 创建SpringBoot项目 Spring Initialize 第一步: 选择创建项目 第二步: 选择起步依赖 第三步: 查看启动类 2.2 springboot父项目 2.3 测试案例 2.3.1 数据库 2.3.2 生成代码 1. SpringBoot介绍 Spring B…
阅读更多...
【Redis 进阶】哨兵模式

【Redis 进阶】哨兵模式

思维导图&#xff1a; 一、哨兵模式概述 &#xff08;一&#xff09;传统主从复制模式的局限性 在传统的Redis主从复制架构中&#xff0c;若主节点发生故障&#xff0c;运维人员需手动执行故障转移操作&#xff0c;将一个从节点提升为新主节点&#xff0c;并逐一通知所有客户…
阅读更多...
CVE-2025-31258 macOS远程视图服务沙箱逃逸漏洞PoC已公开

CVE-2025-31258 macOS远程视图服务沙箱逃逸漏洞PoC已公开

苹果公司近日针对macOS系统中新披露的CVE-2025-31258漏洞发布补丁&#xff0c;该漏洞可能允许恶意应用程序突破沙箱限制&#xff0c;获取未授权的系统资源访问权限。在安全研究员Seo Hyun-gyu公开概念验证&#xff08;PoC&#xff09;利用代码后&#xff0c;该漏洞已在macOS Se…
阅读更多...
武汉大学无人机视角下的多目标指代理解新基准！RefDrone：无人机场景指代表达理解数据集

武汉大学无人机视角下的多目标指代理解新基准！RefDrone：无人机场景指代表达理解数据集

作者&#xff1a;Zhichao Sun, Yepeng Liu, Huachao Zhu, Yuliang Gu, Yuda Zou, Zelong Liu, Gui-Song Xia, Bo Du, Yongchao Xu 单位&#xff1a;武汉大学计算机学院 论文标题&#xff1a;RefDrone: A Challenging Benchmark for Drone Scene Referring Expression Compreh…
阅读更多...
【递归、搜索和回溯】二叉树中的深搜

【递归、搜索和回溯】二叉树中的深搜

个人主页 &#xff1a; zxctscl 专栏 【C】、 【C语言】、 【Linux】、 【数据结构】、 【算法】 如有转载请先通知 文章目录 前言1 2331. 计算布尔二叉树的值1.1 分析1.2 代码 2 129. 求根节点到叶节点数字之和2.1 分析2.2 代码 3 814. 二叉树剪枝3.1 分析3.2 代码 4 98. 验证…
阅读更多...
Algolia - Docsearch的申请配置安装【以踩坑解决版】

Algolia - Docsearch的申请配置安装【以踩坑解决版】

&#x1f468;‍&#x1f393;博主简介 &#x1f3c5;CSDN博客专家   &#x1f3c5;云计算领域优质创作者   &#x1f3c5;华为云开发者社区专家博主   &#x1f3c5;阿里云开发者社区专家博主 &#x1f48a;交流社区&#xff1a;运维交流社区 欢迎大家的加入&#xff01…
阅读更多...
Linux513 rsync本地传输 跨设备传输 一

Linux513 rsync本地传输 跨设备传输 一

ping节点bPing通 仅主机模式不需要设置网关节点a也可以Ping通节点b 同步成功 下载文件夹成功 今日源码 节点a 节点b
阅读更多...
leetcode 383. Ransom Note

leetcode 383. Ransom Note

题目描述 代码 class Solution { public:bool canConstruct(string ransomNote, string magazine) {vector<int> table(26,0);for(char ch : magazine){table[ch-a];}for(char ch : ransomNote){table[ch-a]--;if(table[ch-a] < 0)return false;}return true;} };
阅读更多...
Skyvern：用 AI+视觉驱动浏览器自动化

Skyvern：用 AI+视觉驱动浏览器自动化

Skyvern&#xff1a;用 AI视觉驱动浏览器自动化 一、前言二、项目概览2.1 Skyvern 项目简介2.2 代码结构与模块划分 三、环境搭建与快速上手3.1 环境准备3.1.1 系统与依赖3.1.2 克隆项目3.1.3 安装 Python 依赖3.1.4 配置环境变量3.1.5 启动服务 3.2 验证安装 四、核心功能与实…
阅读更多...
数据库原理期末考试速成--最后附带两套题

数据库原理期末考试速成--最后附带两套题

引言 为什么从3开始呢，毕竟是速成吗，总要放弃一些东西 前两章1.概论 2.关系数据库：这里面都是一些运算符什么的，我感觉都学这个：笛卡尔积之列的都会算 这两章比较重要的我就放在这里了 选择、投影、连接、除、并、交、差，其中选择、投影、并、差、笛卡尔积是5种基本关…
阅读更多...
数据结构基础--蓝桥杯备考

数据结构基础--蓝桥杯备考

1.优缺点总述 STL中各容器对比图 各类线性数据结构优缺点 1.数组 1.优点 1.简单&#xff0c;容易理解 2.访问快捷&#xff0c;只需要用下标就可以 3.有某些应用场景直接对应&#xff0c;例如二维数组对应平面 2.缺点 删除和插入数据非常耗时 2.链表 1.优点 插入和删…
阅读更多...
2.4GHz无线通信芯片选型指南：集成SOC与低功耗方案解析

2.4GHz无线通信芯片选型指南：集成SOC与低功耗方案解析

今天给大家分享几款2.4GHz无线通信芯片方案&#xff1a; 一、集成SOC芯片方案 XL2407P&#xff08;芯岭技术&#xff09; 集成射频收发机和微控制器&#xff08;如九齐NY8A054E&#xff09; 支持一对多组网和自动重传 发射功率8dBm&#xff0c;接收灵敏度-96.5dBm&#xff08…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023