当前位置: 首页 > news >正文

标悬浮展开多级菜单

<!DOCTYPE html>
<html lang="zh-cn"><head><meta charset="utf-8"><title>多级导航菜单</title><meta name="description" content="多级导航菜单"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><style>.dropdown:hover .menu-top {display: block;}.dropdown-submenu {position: relative;}.dropdown-submenu>.dropdown-menu {top: 0;left: 100%;margin-top: -6px;margin-left: -1px;-webkit-border-radius: 0 6px 6px 6px;-moz-border-radius: 0 6px 6px 6px;border-radius: 0 6px 6px 6px;}.dropdown-submenu:hover>.dropdown-menu {display: block;}.dropdown-submenu>a:after {display: block;content: " ";float: right;width: 0;height: 0;border-color: transparent;border-style: solid;border-width: 5px 0 5px 5px;border-left-color: #cccccc;margin-top: 5px;margin-right: -10px;}.dropdown-submenu:hover>a:after {border-left-color: #ffffff;}.dropdown-submenu .pull-left {float: none;}.dropdown-submenu.pull-left>.dropdown-menu {left: -100%;margin-left: 10px;-webkit-border-radius: 6px 0 6px 6px;-moz-border-radius: 6px 0 6px 6px;border-radius: 6px 0 6px 6px;}</style><!-- 新 Bootstrap 核心 CSS 文件 --><link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css"><!-- jQuery文件。务必在bootstrap.min.js 之前引入 --><script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script><!-- 最新的 Bootstrap 核心 JavaScript 文件 --><script src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script></head><body><div class="container collapse navbar-collapse navbar-ex1-collapse"><ul class="nav navbar-nav"><li class="active"><a href="#">Link</a></li><li><a href="#">Link</a></li><li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Multi Level <b class="caret"></b></a><ul class="dropdown-menu menu-top">						<li><a href="#">Level 1</a></li><li><a href="#">Level 1</a></li><li class="dropdown-submenu"> <a tabindex="-1" href="#">More options</a><ul class="dropdown-menu"><li><a tabindex="-1" href="#">Level 2</a></li><li class="dropdown-submenu"> <a href="#">More..</a><ul class="dropdown-menu"><li><a href="#">Level 3</a></li><li><a href="#">Level 3</a></li><li class="dropdown-submenu"> <a href="#">More..</a><ul class="dropdown-menu"><li><a href="#">Level 4</a></li><li><a href="#">Level 4</a></li><li class="dropdown-submenu"> <a href="#">More..</a><ul class="dropdown-menu"><li><a href="#">Level 5</a></li><li><a href="#">Level 5</a></li></ul></li></ul></li></ul></li><li><a href="#">Level 2</a></li><li><a href="#">Level 2</a></li></ul></li></ul></li>				</ul></div></body>
</html>

image

http://www.hskmm.com/?act=detail&tid=33225

相关文章:

  • Nimble:让SwiftObjective-C测试变得更优雅的匹配库 - 指南
  • 2025.10.17总结 - A
  • Ubuntu创建python桌面图标
  • 深入解析Pure恶意软件家族:从RAT到构建器再到开发者
  • Ubuntu上配置Flask应用程序的Nginx和uWSGI
  • 实验一 现代c++基础课程
  • 平均融资利率求法及ORACLE语法解析
  • [Linux]如何列出被软链接的文件,列出被链接位置
  • 10.13课后作业
  • 【Linux】基础 I/O - 指南
  • 不情愿算法学概论
  • DIVCNT
  • 3. JVM 运行时数据区
  • 软工学习日志
  • Pixelium Design:Vue3 的像素风 UI 组件库
  • 修电脑不求人:AI智能修复电脑工具的体验分享
  • 效率与安全双升:AI许可证识别重塑医药行业合规流程
  • Spring BeanPostProcessor 前置处理 afterPropertiesSet BeanPostProcessor 后置处理区别
  • Xcode上编译调试ffmpeg - 详解
  • 最新版Origin 2025b安装包下载及详细安装教程,附永久免费中文汉化破解版Origin安装包
  • 第十七篇
  • 《程序员修炼之道》阅读笔记1
  • Unity3D中定义全局宏(不同于在unity设置中的)
  • AtCoder arc208 总结
  • OOP - 实验一
  • 题解:qoj8329 Excuse
  • `uv run pytest` does not work
  • VMware17.6图文安装教程(附安装包)VMware17.6
  • Sourcetree - Git 备份
  • uni-app x实现上下拉动,动态加载数据