weixin_38422826 2017-10-27 07:33 采纳率: 0%
浏览 1826

水平导航栏-如何设置垂直下拉框。

写的代码是这样子的:
<!DOCTYPE html>



菜鸟教程(runoob.com) ul { list-style-type:none; margin:0; padding:0; } ul li { float: left; padding: 3px; } ul li ul.drop-down-content{ padding: 0; display: none; position: absolute; } ul li a { display:inline-block; height: 30px; width: 80px; text-align: center; line-height:25px; background-color:rgb(214,207,189); border: 1px solid #555; } ul li a:hover { background-color: rgb(247,247,247); } ul li.drop-down:hover ul.drop-down-content{ display: block; }


没有点击把鼠标挪到block上面的时候 效果是这样子的。
图片说明

把鼠标挪到块级元素之后 效果又是这样子的。
图片说明

实际要的效果是这样子的。
图片说明

我想问的问题是:应该如何让下拉菜单垂直下落而不是水平下落?而且在样式里面为什么要设置下拉菜单的样式为position:absolute?

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 彩灯控制电路,会的加我QQ1482956179
    • ¥200 相机拍直接转存到电脑上 立拍立穿无线局域网传
    • ¥15 (关键词-电路设计)
    • ¥15 如何解决MIPS计算是否溢出
    • ¥15 vue中我代理了iframe,iframe却走的是路由,没有显示该显示的网站,这个该如何处理
    • ¥15 操作系统相关算法中while();的含义
    • ¥15 CNVcaller安装后无法找到文件
    • ¥15 visual studio2022中文乱码无法解决
    • ¥15 关于华为5g模块mh5000-31接线问题
    • ¥15 keil L6007U报错