一个不错的下来菜单

最新推荐文章于 2024-05-06 20:12:35 发布
最新推荐文章于 2024-05-06 20:12:35 发布
阅读量335 收藏
点赞数
文章标签： function xhtml float html div 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>jQuery下拉菜单</title>
<script type='text/javascript' src='/ajaxjs/jquery1.3.2.js'></script>
<style type="text/css">
ul{ margin:0; padding:0;}
ul li{ list-style:none}
#div{ width:960px; height:28px;}
#div ul li{ float:left; height:28px; display:inline; line-height:28px; padding:0px 20px; position:relative;}
#div ul li ul{ position:absolute; z-index:99; display:none; top:28px; width:140px; left:0px;}
#div ul li ul li{ display:block; width:140px; height:26px; line-height:26px; background-color:#666; border-bottom:1px #FFFFFF solid;}
#div ul li a{ color:#000000; text-decoration:none;}
</style>
<script type="text/javascript">
  $(function(){
  $("#div ul li").hover(function(){
    $(this).css("background","#333333").children("ul").slideDown();
  },function(){
    $(this).css("background","#fff").children("ul").slideUp();
  })
  $("#div ul li ul li").hover(function(){
     $(this).css("background","#333");
	 },function(){
	 $(this).css("background","#666");
	 })
  })
</script>
</head>
<body>
<div id="div">
 <ul>
   <li><a href="#">首页</a></li>
   <li><a href="#">企业资源</a>
     <ul>
	   <li>企业资源</li>
	   <li>企业资源</li>
	 </ul>
   </li>
   <li><a href="#">新闻中心</a>
         <ul>
	   <li>新闻中心</li>
	   <li>新闻中心</li>
	   <li>新闻中心</li>
	 </ul>
   </li>
   <li><a href="#">工程业绩</a>
         <ul>
	   <li>工程业绩</li>
	   <li>工程业绩</li>
	   <li>工程业绩</li>
	 </ul>
   </li>
   <li><a href="#">仪器设备</a>
            <ul>
	   <li>仪器设备</li>
	   <li>仪器设备</li>
	 </ul>
   </li>
   <li><a href="#">企业文化</a>
             <ul>
	   <li>企业文化</li>
	   <li>企业文化</li>
	 </ul>
   </li>
   <li><a href="#">联系我们</a>
             <ul>
	   <li>联系我们</li>
	   <li>联系我们</li>
	   <li>联系我们</li>
	 </ul>
   </li>
 </ul>
</div>
</div>
</body>
</html>

fanxin_1999
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
纯前端实现—下拉菜单
孤寒者的博客
11-14 3万+
实现效果： 下拉菜单 源码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>下拉菜单</title> <style> li { width
html表格的多个下拉菜单,表格设置下拉多个选项
weixin_35032509的博客
06-04 1949
搞定Office每周三更新「搞定Office」是黑马公社全新的七大版块之一，每周三更新，教授Office等办公软件的各种应用技巧。◆◆◆Excel表格如何实现二级下拉菜单的联动黑马说：有时候我们需要为表格做下拉菜单，一级的下拉菜单你可能直接用数据验证或者数据有效性就可以实现，那今天黑马要教给大家的是有关二级菜单的联动，Office达人可要看过来了哦！BY：Andy◆◆◆图文说明效果展示点击这里“市...
如何在Word中将所有图片批量设置为居中对齐
热门推荐
Fitz的博客
05-15 2万+
当我们写论文的时候，可能会插入许多的图片，但是格式要求往往要求图片居中。假如在论文完成后，如何设置为让所有图片居中呢？在百度了之后，找到下面方法。这里我使用的是WPS。首先打开查找替换，如下图所示。点击替换，选择特殊格式，并在特殊格式下拉栏中选择图形然后点击“替换为”，点击格式，选择段落，如下图所示接着，在对齐方式中选择居中对齐，如下图所示。最后，点击确定，再点击全部替换，就大功告成了。...
MPC5744——系统集成单元(SIUL2)
南风北雨
11-18 8852
系统集成单元最主要的作用是控制引脚的功能和电气特性。同时还能控制内部信号路由到另外一个，模块之中。 寄存器汇总： SIUL2_MIDR2 MCU ID 寄存器 #1 和#2 ：寄存器内包含着MCU的一些信息。 SIUL2_DISR0 DMA/Interrupt状态标志寄存器 0 共32位，0 没有事件发生，1 DMA或中断事件发生，事件由触发类型寄存
html如何实现日期下拉菜单,实现一个日期下拉菜单
weixin_29023079的博客
06-10 6136
这篇文章的主旨是弄清楚如何根据实际需求实现一个联动菜单以及联动菜单的原理，实例是实现一个日期选择下拉菜单。本文调试环境为IE6/firefox1.5。首先来分析一下日期下拉菜单的需求。建议大家在写任何程序的时候都应该在动手编程之前想清楚自己需要些什么，这样编程才有效率。年份： 一般来说有一个有效年份，比如说1900年至当前年份才是为效的，这个要根据实际需求来确定，如果是该下拉菜单是用来选择出生年月...
python下拉菜单_python下拉菜单
weixin_39880621的博客
11-21 2069
广告关闭腾讯云11.11云上盛惠 ，精选热门产品助力上云，云服务器首年88元起，买的越多返的越多，最高返5000元！（一） select类select类是selenium的一个特定的类，用来与下拉菜单和列表交互。 下拉菜单和列表是通过html的＜select＞ 元素实现的。 选择项是通过＜select＞中的＜option＞元素实现的。 使用前使用下面的语句导入模块。 from selenium.w...
flutter实现一个下拉菜单【基于PopupMenuButton】
个人网站：https://www.longzipeng.online
03-30 1万+
提示 已将代码上传至gitee，后续会继续更新学习封装的一些组件： flutter练习 实现效果 ![请添加图片描述](https://img-blog.csdnimg.cn/7389082e2ba94898a788729437efd94f.gif 实现过程 1.封装菜单子项MenuItem /// @author longzipeng /// @创建时间：2022/3/30 /// 通用菜单项model class MenuItem { String label; // 显示的文本 dynam
android下拉菜单总结
唐诺
04-15 5258
Android下拉菜单总结： Spinner： Spinner自定义样式，下拉图标 https://www.runoob.com/w3cnote/android-tutorial-spinner.html https://blog.csdn.net/cyan20115/article/details/106551693 PopuWindow（背景会遮挡标题栏）： https://www.runoob.com/w3cnote/android-tutorial-popupwindow.html ht
android studio 下拉菜单,怎么在android studio中使用Spinner实现一个下拉菜单
weixin_32176655的博客
05-26 2702
怎么在android studio中使用Spinner实现一个下拉菜单发布时间：2021-03-23 14:56:15来源：亿速云阅读：92作者：Leah这期内容当中小编将会给大家带来有关怎么在android studio中使用Spinner实现一个下拉菜单，文章内容丰富且以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。一、认识SpinnerSpinner其实就是一个列表选择框。...
搜集了几个不错的下拉菜单效果
01-19
现在的下拉菜单是兼容性越来越好了，不用js的最好了，但如果能用最少的代码实现出效果，也是不错的第一个，用到的js,不过很短，也很明了 *{font:normal normal 14px/1.5em “宋体”;} li{list-style:none;} span{...
LabVIEW实现下拉列表菜单
03-01
1.下拉列表控件可以展开为菜单 2.下拉列表可以建立子项
ReactNative自定义下拉菜单
05-25
自定义下拉菜单
一个日期下拉菜单的js实现代码
10-27
用js实现的日期下拉菜单效果代码，用js主要是方便控制，不需要输入很多的菜单
用php完成下拉菜单,最新的8个实现下拉菜单功能的总结
weixin_28858247的博客
03-09 1889
在计算机应用中，下拉式选单是选单的一种表现形式。具体表现为：当用户选中一个选项后，该选单会向下延伸出具有其他选项的另一个选单。下拉式选单通常应用于把一些具有相同分类的功能放在同一个下拉式选单中，并把这个下拉式选单置于主选单的一个选项下。下拉菜单内的项目可以据需要设置为多选或单选，可以用来替代一组复选框(设置为多选)或单选框(设置为单选)。这样比复选框组或单选框组的占用位置小，但不如它们直观。使用 ...
常见的 HTML 标准
csdn_ad986ad的博客
04-30 814
HTML（Hypertext Markup Language）有多个版本和标准。
jquery项目 html使用export import方式调用模块
LlanyW的专栏
05-06 212
jquery的老项目，引入vue3, 需要方便使用export, import方式引用一些常用的方法与常量。
HTML 图片标签
weixin_46011290的博客
05-06 493
【alt】: 图片的描述，这个描述默认情况下不会显示，有些浏览器会在图片无法加载出来的时候显示在页面上。建议：在PC端不建议修改图片的大小，大图缩小浪费内存，小图放大图片失真，最好是切图。它具备其他图片格式的所有优点，而且图片还特别的小，显示效果好，透明度也好，还支持动图。，还可以将图片使用base64进行编码，将图片转换为字符，通过字符的形式来引入图片。【src】：属性指定的是外部图片的路径（路径规则和超链接是一样的）支持的颜色比较少，支持简单透明，支持动画。支持颜色丰富，支持透明复杂，不支持动画。
JavaWeb入门-HTML
最新发布
woai3364的博客
05-06 415
html>内容语法：通过标签的形式展示。①超文本 图片、音频、视频、普通文本。标签可以嵌套但不能交叉嵌套。无论是双标签还是单标签都必须正确关闭。跟标签（html）有且只能有一个。-- 注释内容 --!标签不区分大小写但建议使用小写。①新建网页文件（后缀为.html的文件）③通过开发工具IDEA。②创建网页的基本结构。
做一个html下拉菜单
06-03
我们使用`<label>`标签来为下拉菜单提供一个标签，在`<select>`标签中定义了四个选项，每个选项使用`<option>`标签来定义。每个`<option>`标签都有一个`value`属性，表示当用户选择该选项时将发送给服务器的值。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值