css黑色二级下拉导航菜单

黑色二级下拉导航菜单icon-default.png?t=N7T8https://www.bootstrapmb.com/item/14816

 
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}nav {
background-color: #000; /* 导航背景色为黑色 */
}.menu {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
}.menu li {
float: left;
}.menu li a {
display: block;
color: #fff; /* 链接文字颜色为白色 */
text-align: center;
padding: 14px 16px;
text-decoration: none;
}.menu li a:hover {
background-color: #111; /* 链接悬停时背景色为深灰色 */
}/* 二级菜单样式 */
.dropdown {
position: relative;
display: inline-block;
}.submenu {
display: none;
position: absolute;
background-color: #000; /* 二级菜单背景色为黑色 */
min-width: 160px;
z-index: 1;
}.submenu li {
float: none;
border-bottom: 1px solid #222; /* 二级菜单项之间的分隔线 */
}.submenu li:last-child {
border-bottom: none; /* 移除最后一个菜单项的分隔线 */
}.submenu li a {
color: #fff; /* 二级菜单链接文字颜色为白色 */
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}.submenu li a:hover {
background-color: #111; /* 二级菜单链接悬停时背景色为深灰色 */
}.dropdown:hover .submenu {
display: block; /* 当鼠标悬停在包含二级菜单的li上时,显示二级菜单 */
}

这个示例中,.menu 是主菜单的样式,.submenu 是二级菜单的样式。当鼠标悬停在包含二级菜单的li上时,二级菜单会显示出来。你可以根据需要调整样式和布局。

 

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ARP欺骗——华为ensp

首先,搭建好网络拓扑。网络设备包含客户端Client1和服务端Server1,交换机 以及 云。 图中的 Client和Server 配置IP地址,要和 vm8 在相同的网段。故设置客户端ip为192.168.11.10 ,服务端ip为:192.168.11.20&#xff0…

uni-app AppStore Connect上传拒绝汇总

1.Guideline 2.3.3 - Performance - Accurate Metadata 问题是图片不对,最好是自己截图,然后用香蕉云编 上传图片合成图片 2.Guideline 5.1.2 - Legal - Privacy - Data Use and Sharing 解决办法:在uniapp manifest.json找到 APP常用其他…

【Ubuntu】Ubuntu系统镜像

清华镜像源 Index of /ubuntu-releases/ | 清华大学开源软件镜像站 | Tsinghua Open Source MirrorIndex of /ubuntu-releases/ | 清华大学开源软件镜像站,致力于为国内和校内用户提供高质量的开源软件镜像、Linux 镜像源服务,帮助用户更方便地获取开源软…

Llama 3.1要来啦?!测试性能战胜GPT-4o

哎呀,Meta声称将于今晚发布的Llama 3.1,数小时前就在Hugging Face上泄露出来了?泄露的人很有可能是Meta员工? 还是先来看泄露出来的llama3.1吧。新的Llama 3.1模型包括8B、70B、405B三个版本。 而经过网友测试,该base…

Langchain核心模块与实战[8]:RAG检索增强生成[loader机制、文本切割方法、长文本信息处理技巧]

Langchain核心模块与实战[8]:RAG(Retrieval Augmented Generation,检索增强生成) RAG(Retrieval-Augmented Generation)技术是一种结合检索和生成功能的自然语言处理(NLP)技术。该技术通过从大型外部数据库中检索与输入问题相关的信息,来辅助生成模型回答问题。其核心…

gitee的怎么上传项目

前提 1.先下载Git Bash (如果没有下载的宝子们下载连接如下: 链接: link ) 项目上传到Gitee步骤 1.在Gitee上建立远程仓库 2.填写相关信息 3.进入本地你想要上传的文件目录下,右键单击空白处,点击Git Bash Here 4.配置你的用户名和邮箱 git con…

使用Ollama和OpenWebUI,轻松探索Meta Llama3–8B

大家好,2024年4月,Meta公司开源了Llama 3 AI模型,迅速在AI社区引起轰动。紧接着,Ollama工具宣布支持Llama 3,为本地部署大型模型提供了极大的便利。 本文将介绍如何利用Ollama工具,实现Llama 3–8B模型的本…

Android APP CameraX应用(02)预览流程

说明:camera子系统 系列文章针对Android12.0系统,主要针对 camerax API框架进行解读。 1 CameraX简介 1.1 CameraX 预览流程简要解读 CameraX 是 Android 上的一个 Jetpack 支持库,它提供了一套统一的 API 来处理相机功能,无论 …

爬虫学习3:爬虫的深度爬取

爬虫的深度爬取和爬取视频的方式 深度爬取豆瓣读书 import time import fake_useragent import requests from lxml import etree head {"User-Agent":"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 …

双向链表(C语言版)

1. 双向链表的结构 注意:这里的“带头”跟单链表的“头结点”是两个概念,实际上在单链表阶段称呼不太严谨,但是为了更好地理解就直接称为单链表的头结点。带头链表里的头结点,实际为“哨兵位”,哨兵位结点不存储任何有…

MaxSite CMS v180 文件上传漏洞(CVE-2022-25411)

前言 CVE-2022-25411 是一个影响 Maxsite CMS v180 的远程代码执行漏洞。攻击者可以通过上传一个特制的 PHP 文件来利用这个漏洞,从而在受影响的系统上执行任意代码。 漏洞描述 该漏洞存在于 Maxsite CMS v180 的文件上传功能中。漏洞利用主要通过允许上传带有危…

Vue 3项目安装Element-Plus

Element Plus 是一个基于 Vue 3 的现代前端UI框架,它旨在提升开发体验,并为开发者提供高效、优雅的组件。如果你正在使用 Vue 3 进行项目开发,那么安装和集成 Element Plus 是一个不错的选择。在本文中,博主将详细介绍如何在 Vue …

【SASS/SCSS(三)】样式的复用与动态计算(@mixin和@function)

目录 一、mixin 1、定义复用的样式代码,接受传参,搭配include使用。 位置传参 关键词传参 ...语法糖接受传入的任意参数 2、在mixin中使用content,获取外部对mixin的追加内容 二、function 三、字符串——值得注意的点 很多时候&#…

智慧大棚数据库版

创建一个SMartBigHouse数据库 在数据库创建一个表用来存储数据 这边将id设为主键并将标识增量设为1 搭建Winfrom 搭建历史查询界面 串口数据,(这边是用的一个虚拟的串口工具,需要的话私) ModbusSerialMaster master;DataPointCollection wenduValues; //…

细说MCU用DMA控制ADC采样和串口传送的实现方法

目录 一、建立工程 1.相同的配置 2.配置ADC 3.配置DMA 二、代码修改 1.定义存储ADC采样结果的数组 2.启动ADC与定时器 3.编写主程序代码 4.重定义回调函数 5.查看结果 三、修改DMA模式 1. 修改DMA模式为Circular 2.查看结果 采用DMA(Direct Memory Access&#xf…

WSL2 Centos7 Docker服务启动失败怎么办?

wsl 安装的CentOS7镜像,安装了Docker之后,发现用systemctl start docker 无法将docker启动起来。 解决办法 1、编辑文件 vim /usr/lib/systemd/system/docker.service将13行注释掉,然后在下面新增14行的内容。然后保存退出。 2、再次验证 可以发现,我们已经可以正常通过s…

关于Mysql的面试题(实时更新中~)

一、主键约束与“not null unique”区别 1、作为Primary Key的域/域组不能为null,而Unique Key可以。 2、在一个表中只能有一个Primary Key,而多个Unique Key可以同时存在。unique not null 可以 将表的一列或多列定义为唯一性属性,而prima…

redis的集群模式

目录 1. 为什么使用redis集群 2. 主从模式 2.1修改配置文件 2.2 开启三台redis服务 2.3配置主从关系 3. 哨兵模式 3.1 监控功能 3.2 选举的机制 3.3 准备条件 4. 去中心化模式 4.1 准备三主三从 4.2 启动redis 4.3 分配槽以及主从关系 4.4 命令行的客户端 redis提供…

CAD框架介绍

1、适用范围:矢量编辑软件如 服装模板软件、CAD软件、绘图软件 2、支持PLT,DXF,PDF,GCode(服装裁割指令)等矢量文件导入 3、支持简易的自动手动排料 4、直线,曲线等编辑功能 5、分页输出绘图指令 6、良好的框架结构:绘图引擎…

d3d12.dll 文件缺失如何解决?五种修复丢失问题的方法

d3d12.dll 文件缺失如何解决?它为什么会不见呢?今天,我们将探讨 d3d12.dll 文件的重要性、原因以及丢失时的解决策略。本文将全面介绍 d3d12.dll 文件,并提供五种修复丢失问题的方法。 d3d12.dll文件是什么的详细介绍 d3d12.dll …