二级水平导航菜单栏的实现

1.

这个是本人设计的一带一路的二级水平导航栏HTML代码;

这里最后实现的效果是鼠标悬停在导航栏上面,就会显示下面的4个部分页面,这里只是以评论热

点作为例子,其他的类似;

2.首先要设计DIV,然后利用无序列表的知识,在每一个导航栏目里面嵌套一个无序列表

这个嵌套的无序列表就是悬停显示的菜单栏;

3.

这个是CSS代码:

4~6:在没有设置CSS的时候,会竖直显示,这个就是CSS设置改为水平排列;

8~19:这个就是设置参数加上背景和分割线;

20~21:定义子菜单的样式,设置高度以和主菜单进行区分;

24~30:子菜单的初始状态是隐藏,鼠标滑过以后就会显示出来。

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

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

相关文章

Android 消息恢复 - 如何在 Android 上检索已删除的短信

最新调查显示,手机每天发送和接收的短信数以亿计,尤其是Android智能手机。但与此同时,Android消息丢失也每天都在发生。因此,如何恢复Android手机上已删除的短信对于那些在设备中保存了一些重要信息的人来说似乎非常重要。 在这里…

数字经济的新篇章:Web3的全球影响

随着区块链技术的飞速发展,Web3作为其重要组成部分,正在成为数字经济的新篇章,并在全球范围内展现出巨大的影响力。本文将深入探讨Web3对全球经济的影响,以及它所带来的新机遇和挑战。 1. Web3的定义与特点 Web3是建立在区块链技…

【Python--读获取目录下所有csv文件中的均值与偏态】

🚀 作者 :“码上有前” 🚀 文章简介 :Python 🚀 欢迎小伙伴们 点赞👍、收藏⭐、留言💬 python练习题 读获取目录下所有csv文件中的均值与偏态按照均值和偏态最大值进行排序完整代码 读获取目录下…

基于OpenCV的图形分析辨认03

目录 一、前言 二、实验目的 三、实验内容 四、实验过程 一、前言 编程语言:Python,编程软件:vscode或pycharm,必备的第三方库:OpenCV,numpy,matplotlib,os等等。 关于OpenCV&…

LeetCode.2917. 找出数组中的 K-or 值

题目 2917. 找出数组中的 K-or 值 分析 这道题其实是要我们求第i位二进制为1的元素个数至少为k,把符合条件的2^i全部加到一起。 因此,我们的思路就是枚举数组的每一位,并且进行以下两个步骤: 统计所有元素第i位1的个数cnt。…

【论文阅读】DeepLab:语义图像分割与深度卷积网络,自然卷积,和完全连接的crf

【论文阅读】DeepLab:语义图像分割与深度卷积网络,自然卷积,和完全连接的crf 文章目录 【论文阅读】DeepLab:语义图像分割与深度卷积网络,自然卷积,和完全连接的crf一、介绍二、联系工作三、方法3.1 整体结构3.2 使用空间金字塔池…

弹性地基梁matlab有限元编程 | 双排桩支护结构 | Matlab源码 | 理论文本

专栏导读 作者简介:工学博士,高级工程师,专注于工业软件算法研究本文已收录于专栏:《有限元编程从入门到精通》本专栏旨在提供 1.以案例的形式讲解各类有限元问题的程序实现,并提供所有案例完整源码;2.单元…

mysql bug( InnoDB: Error number 22),表突然不能读取

mysql bug( InnoDB: Error number 22),表突然不能读取 bug最开始的bug:表突然不能读取关闭mysql容器,再次重启失败 解决方案不重建容器的几种可能措施重建容器重建如果懒得打命令或者忘记命令可能的run bug&#xff1a…

打破界限,释放创新:一键将HTML转化为PDF

在互联网时代,HTML作为网页的标准语言,承载着无数的信息与创意。然而,有时我们需要将这些在线内容转化为可打印、可分享的PDF格式。这时,一款高效、便捷的转换工具就显得尤为重要。 首先,我们要进入首助编辑高手主页面…

react高阶组件:如何同时兼容class类组件和函数式组件。

场景: 每个页面都要实现分享功能,但是页面有些是用class类,有些又直接是函数式。 方案1: 写2套方法。各自引用。(维护不太好,改要改2遍) 方案2: 可以封一个 jsx的组件&#xff0c…

中国制造走向世界wordpress外贸建站模板主题

水泵阀门wordpress外贸网站模板 水泵、阀门、管材、管件wordpress外贸网站模板,适合外贸独立站的网站模板。 https://www.jianzhanpress.com/?p3748 保健器械wordpress外贸网站主题 保健、健身器械wordpress外贸网站主题,适合做外贸网站的wordpress模…

【QT C++实践】Qt 项目中一个界面动态处理多张数据库中的表|附源码

一、前言 在之前那篇讲如何使用QT连接数据库时(QT C实践|超详细数据库的连接和增删改查操作|附源码),做了一个简单的对数据库进行增删改查的界面(如下)。 但是存在一个问题就是:这个界面只是对一张表进行操作,但是我…

2023年CSP-J认证 CCF信息学奥赛C++ 中小学初级组 第一轮真题-选择题解析

2023年 中小学信息学奥赛CSP-J真题解析 1、在C中,下面哪个关键字用于声明一个变量,其值不能被修改 A、unsigned B、const C、static D、mutable 答案:B 考点分析:主要考查变量声明相关知识,const是声明常量&…

0基础跨考408|一战上岸复盘及经验分享

基础阶段‼️ 王道的四本书的选择题部分要都做完、订正完。 王道的四门视频课要一轮刷完(或者题主在B站看了其他的老师,这其实也是算一轮的,只要题主是认真学习了的,题主说自己不知道看什么课,王道就好了)…

Go程序是如何编译并运行起来的(图文详解)

Go程序是如何编译的 从hello RdrB1te开始 package main import "fmt" func main() { fmt.Println("hello RdrB1te") }不实际编译它,只输出它的编译过程: go build -n简单的编译过程分析: 上面的过程确认了两个…

Cookie和Session(会话技术)

文章目录 Cookie和Session(会话技术)一、Cookie1、Cookie概述1.1、Cookie简介1.2、Cookie的使用场景1.3、Cookie底层原理 2、Cookie的基本使用3、Cookie实现显示用户上次访问时间4、Cookie编码与解码5、Cookie总结 二、Session1、Session概述1.1、Sessio…

FPGA高端项目:FPGA基于GS2971的SDI视频接收+OSD动态字符叠加,提供1套工程源码和技术支持

目录 1、前言免责声明 2、相关方案推荐本博已有的 SDI 编解码方案本方案的SDI接收转HDMI输出应用本方案的SDI接收图像缩放应用本方案的SDI接收纯verilog图像缩放纯verilog多路视频拼接应用本方案的SDI接收HLS图像缩放HLS多路视频拼接应用本方案的SDI接收HLS多路视频融合叠加应用…

基于Matlab实现免疫荧光图像中的区域定位算法

基于Matlab实现免疫荧光图像中的区域定位算法 免疫荧光法。以荧光染料为标记物,试纸条为载体,发生抗原抗体特异性反应,根据免疫复合物被激发的荧光强度对待测物进行定量分析[。该方法具有环境要求不高、操作简单快速、无污染且荧光染料丰富等优点。 常用于食品安全检测过程中…

vue3+element plus 实现百度地图显示路径

添加依赖 <!-- index.html --><script type"text/javascript" src"//api.map.baidu.com/getscript?v3.0&akyI6kBeC9G4LntEWXklE2iNHwRUrmFEQc"></script><script type"text/javascript" src"//api.map.baidu.co…

【golang】26、retry-go 使用示例和源码解析

文章目录 一、使用方法1.1 http 示例1.1.1 retry.Do1.1.2 retry.DoWithData1.1.3 OnRetry1.1.4 根据 error 的类型&#xff0c;决定 delay 的时长1.1.5 自定义 retry function 二、API2.1 Do 执行2.1.1 Do2.1.2 DoWithData 2.2 Delay 策略2.3 错误处理2.3.1 Unwrap2.3.2 Unwrap…