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

二级下拉菜单Css

css实现简单的二级下拉菜单的思路: 1、创建菜单展示目录的html: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content=""> <meta name="Author" content=""> <meta name="

css制作横排二级下拉菜单,代码如下:<body> <ul id="FM"> <li><a href="#">一级栏目</a> <ul> <li><a href="#">二级菜单</a></li> <li><a href="#">二级菜单</a></li> <li><a href="#">二级菜单</a></li> </ul> </li> <li><a href="#">一

就这个CSS逻辑,详细代码自己研究一下吧 重点核心的用法就是这个 ul.menu li ul{display: none;} //一般时候都别显示二级菜单 ul.menu li:hover ul{display: block;} //滑鼠经过时,就显示二级菜单出来主页关于link1link2link3联系我们 想了解深入,可以看看百度的这篇:http://wenku.baidu.com/link?url=6_9MuyTG3WlzT_4Unf2RpxSb6lZ30uJR1npqYfZiMvNMi1a5SXJ9BCLpcbOqzsSkGRCX8qk5y2PK0gz5akt1-SqflckAUoNSu87FNBrZu0S

<style><!--* {margin:0px;padding:0px;} body {overflow:scroll;font-size:12px;font-family:Arial, Helvetica, sans-serif;color:#000;} a {font-size:12px;font-family:Arial, Helvetica, sans-serif;color:#000;text-decoration:none;}.menu {position:relative;width:1000

一级导航 二级导航 二级导航 二级导航 二级导航 *{ padding:0; margin:0;}#nav{ width:996px; margin:0 auto; margin-top:20px;}ul{ list-style:none;}#nav > ul > li{ color:#999; float:left; width:120px; padding:10px 5px; font-size:14px; text-align:center;

<!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/

参考: http://www.alixixi.com/Dev/HTML/jsrun/menu/2008/2008090180607.html

现在我们为nav添加样式,首先去掉默认的margin和padding,再去掉<ul>< li>标签的list-style样式和<a>标签的默认下划线.接下来再添加适当的样式(根据实际需要添加)进行美化,如一下样式:<style type="text/css">* { margin:0; padding:0;

在DW CS6中制作,非常简单新建一个文件,命名后保存,然后单击菜单“插入”,向下选择spry,再向右下选择spry菜单栏,会出来一个对话框,你任意选择横向还是竖向,自带CSS,不必你自己设置,但可以任意修改.

<div><ul><li>一级菜单<div><ul><li>二级菜单</li></ul></div></li></ul></div> 一个盒子里面套一个盒子,在把布局做的美观点就好了.如果想横项排列的话可以让一级菜单float:left 左浮动 ,二级菜单定义为行块级 在一级菜单下,在设置为隐藏,鼠标hover时候显示,再给二级菜单布置一个背景图片,在设置一个边距border 字体颜色之类的.就好看了.

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