美文网首页
如何制作二级菜单

如何制作二级菜单

作者: 周周很可爱 | 来源:发表于2019-06-18 22:41 被阅读0次

大家好,相信很多小伙伴会发现一个有趣的现象,当我们浏览一个网页的时候,本来静态的网页,可能因为我们划过某处时,会出现一个列表或者是图片,这里就用到了二级菜单了,接下来我为大家简单讲解一下二级菜单的制作。

image.png

这是一个列表,当划过我的携程这个选项的时候,它的下面会出现一个列表,当我们不把鼠标划过它的时候,这个列表又会隐藏,我们首先要在<li></li>里面建一个盒子,里面写着我们要写的内容


image.png

我们给这个盒子起名为.erji-top1,
我们接下来给它写样式


image.png 。
我们要给它一个绝对定位,给它的父元素<li>我的携程</li>
一个相对定位,给它设置成隐藏的状态, image.png


然后给li设置划过显示.erji-top1就可以啦

相关文章

  • EXCEL/WPS中INDIRECT函数用法

    如何使用Indirect函数制作出二级菜单效果(二级菜单随着一级菜单变化) 第一步:制作一级菜单,这里用到数据有效...

  • 如何制作二级菜单

    大家好,相信很多小伙伴会发现一个有趣的现象,当我们浏览一个网页的时候,本来静态的网页,可能因为我们划过某处时,会出...

  • 2019-03-06

    今日依旧是在赶寒假任务,今晚的主要内容是制作隐藏的二级菜单,当点击一级菜单时显示二级菜单。 之前有制作过一...

  • Excel里面如何建立二级下拉菜单

    二级下拉菜单在工作表中也是经常会需要使用到的功能。下面就来介绍一下如何建立二级下拉菜单。 建立二级下拉菜单 如图,...

  • 纯CSS3实现二级三级菜单的动态效果

    纯CSS3制作二级菜单特效 基础掌握知识:1.boder-radis圆角的制作 2.linear-gradient...

  • bootstrap 导航

    bootstrap导航加下拉菜单(二级导航) 如图 说明在Bootstrap框架中制作二级导航,只需要将li当作父...

  • E战到底特训营第十一天

    今日复习课程: 把下拉菜单又操作一遍,回忆INDIRECT函数的原理制作二级下拉菜单,offset函数暂未研...

  • 鼠标划过多级联动菜单制作方案

    如果你的项目需要制作3级以上联动菜单,就是那种鼠标划过一级菜单时二级菜单会显现、并同时会显示一个默认的三级菜单,而...

  • 导航栏+面包屑(js手动实现)

    1,页面视图 一级菜单 一级菜单高亮 二级菜单 二级菜单下拉,父级高亮 二级菜单选项高亮 2, 以上视图就总结完了...

  • 关于2级菜单栏中a和li样式的混淆

    html部分 二级菜单的放置位置不要把二级菜单放到a标签里面,如果二级菜单里面也有a标签的话,会导致元素错位。二级...

网友评论

      本文标题:如何制作二级菜单

      本文链接:https://www.haomeiwen.com/subject/sdiqqctx.html