ydzf.net
当前位置:首页 >> html二级下拉菜单横向 >>

html二级下拉菜单横向

首页打开dreamweaver或其它编辑器,创建一个名为nav的导航菜单 <div class="nav"> <ul> <li><a href="#">栏目一</a></li> <li><a href="#">栏目二</a></li> <li><a href="#">栏目三</a></li> <li><a href="#">栏目四</a></li> <li><a

清除下cdak里的垃圾软见看下

百度下CSS BOOKSHELF,第6课就是!

一、首先,打开dreamweaver或其它编辑器(注:Ctrl+N 新建)二、接着,写代码html>横排二级下拉菜单 栏目一 二级栏目 二级栏目 二级栏目 二级栏目 栏目二 二级栏目 二级栏目 二级栏目 二级栏目 栏目三 二级栏目 二级栏目 二级栏目 二级栏目 二级栏目 栏目四 栏目五三、最后,效果图四、注意:这种写法不支持IE6浏览器,IE6只支持a下的hover,所以无法实现正确的显示,但是微软已经将IE6浏览器淘汰了,但是如果您还在使用,那么请添加相应的js实现.

html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "二级dropdown弹出菜.menu {font-family: arial, sans-serif; width:750px; margin:0; margin:50px 0;}.menu ul {padding:0; margin:0;list-style-type: none;}.menu ul li {float:left; position:relative;}

这里有一个js的多级联动下拉菜单 可以自定义位置和样式 比较实用 里面有教程和源码

这个得用一些js框架来做比较简单,手写不太好达到效果.

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style type="text/css"> /*一二级菜单横向排列*/ ul li{ float: left; } /*二级菜单默认不显示*/ ul li ul{ display: none; } /*一级菜单获得焦点时显示其二级菜单*/

给你提示下,把li dt 设为display:none;然后LI:hover ul{ display:block}

我直接在你的基础上改了点样式:<ul style=" position: relative;"><li class="ul-li"><a href="http://www.xue01.com">首页</a></li><li class="ul-li"><a href="http://www.xue01.com/dushubiji/" title="读书笔记">读书笔记</a><ul class="

wkbx.net | lpfk.net | clwn.net | jjdp.net | ymjm.net | 网站首页 | 网站地图
All rights reserved Powered by www.ydzf.net
copyright ©right 2010-2021。
内容来自网络,如有侵犯请联系客服。zhit325@qq.com