css技巧分享：怎么用css制作横排二级下拉菜单

需要准备的物品

笔记本

浏览器

详细介绍方法/步骤

打开记事本，先输入个页面框架

！声明文档类型

html xmlns=" http://www .w3。org/1999/xhtml "

伸角

/hade

身体

/body

框架好了，那么就该定义页面的标题，关键词关键字，和描述描述

meta charset=" utf-8 " content=" text/html " http-equiv=" content-type "

标题纯钢性铸铁二级导航下拉菜单/title

元名称="关键字"内容="搜狗略懂"

元名称="描述"内容="描述"

这些内容只能在头部/头部中完成。

定义页面使用的钢性铸铁样式，也是需要在头里定义的。

style type="text/css "

* {

边距n:0

padding:0

}。jiao ul li a:hover{

颜色： #红色；

}

ul，li {

列表样式：无；

}

a {

text-decoration : none

}。娇{

border:5px实心#粉色；

右边框：无；

飞越：隐藏；

float:left

余量：200px 0 0 600px

}。阿利

边框-右：实心；

border-top:2px虚线# 666;

背景： #黑色；

}。焦裕利{ float:left}。焦阿利{横向：150像素；高度：80 pxtext-中心对齐：行高：100 pxdisplay : block border-right :5 px实心#红色；背景： #红色： #红色；}。jiao ul li ul {位置：；display:none}。jiao ul li :悬停ul {显示：块；}。焦裕利{ float:none}

！- navul只选择航行下一级里面的保险商实验所元素

nav ul选择航行内所包含的所有保险商实验所元素

navul比nav ul限定更严格，必须后面的元素只比前面的低一个级别。

这里根据你的需求来自己定义。

-

/style

添加一个差异标签，在页面中划分出一个块来，用来显示。

差异中所用的样式为刚才咱们声明的样式"娇"这个盒子来描述

然后使用无序标签保险商实验所样式里来实现模块。

div class="jiao "

保险商实验所

lia href="# "搜狗略懂/a

保险商实验所

lia href="# "搜狗问问/a/li

lia href="# "搜狗输入法/a/li

lia href="# "搜狗浏览器/a/li

lia href="# "搜狐/a/li

/ul

/div

放上全部的代码吧，可以参考一下啊，

！声明文档类型

html xmlns=" http://www .w3。org/1999/xhtml "//允许你通过一个网址来识别你的标记

头

meta http-equiv=" content-type " content=" text/html；charset=utf-8" /

元名称="关键字"内容="利用钢性铸铁实现下拉菜单"

元名称="描述"内容="搜狗略懂、css分享"

titlecss实现下拉导航栏菜单/title

style type="text/css "

* {

边距n:0

padding:0

}。jiao ul li a:hover{

颜色： #红色；

}

ul，li {

列表样式：无；

}

a {

text-decoration : none

}。娇{

border:5px实心#粉色；

右边框：无；

飞越：隐藏；

float:left

余量：200px 0 0 600px

}。阿利

边框-右：实心；

border-top:2px虚线# 666;

背景： #黑色；

}。焦裕利{ float:left}。焦阿利{横向：150像素；高度：80 pxtext-中心对齐：行高：100 pxdisplay : block border-right :5 px实心#红色；背景： #红色： #红色；}。jiao ul li ul {位置：；display:none}。jiao ul li :悬停ul {显示：块；}。焦裕利{ float:none}

！- navul只选择航行下一级里面的保险商实验所元素

nav ul选择航行内所包含的所有保险商实验所元素

navul比nav ul限定更严格，必须后面的元素只比前面的低一个级别。

这里根据你的需求来自己定义。

-

/style

/head

身体

div class="jiao "

保险商实验所

lia href="# "搜狗略懂/a

保险商实验所

lia href="# "搜狗问问/a/li

lia href="# "搜狗输入法/a/li

lia href="# "搜狗浏览器/a/li

lia href="# "搜狐/a/li

/ul

/li

/ul

/div

/body

/html

如果要添加更多的菜单，只需要后边继续添加ul/li即可

温馨提示

在写代码的过程中，一定要记得换行，开头留白，不然后面会有发现，甚至不知道写什么。如何谈在哪里找？