育才学习网css下拉菜单怎么写
1.html+css下拉菜单怎么制作
使用HTML和CSS制作下拉菜单的方法如下：
1、编写带有div导航的html代码：
2、使用class=“nav”属性的'div'标签作为菜单的容器。在截图中，在图示的HTML代码中，一个简单的无序列表（ul）来表示主菜单项。
3、在主菜单区域中添加链接。在本步骤中，在无序列表（ul）每一项上添加链接。
4、在“关于我们（About Us）”下方LI标签内添加一个无序列表，它代表其子菜单的链接。
5、制作导航css:
2.css 如何做下拉菜单
纯css三级下拉菜单，下面是样式表<style type="text/css"> /* common styling */ .menu {font-family: arial, sans-serif; width:750px; position:relative; margin:0; font-size:11px; margin:50px 0;} .menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000;width:104px; height:20px; text-align:center; color:#fff; border:1px solid #fff; background:#710069; line-height:20px; font-size:11px; overflow:hidden;} .menu ul {padding:0; margin:0;list-style-type: none; } .menu ul li {float:left; margin-right:1px; position:relative;} .menu ul li ul {display: none;} /* specific to non IE browsers */ .menu ul li:hover a {color:#fff; background:#36f;} .menu ul li:hover ul {display:block; position:absolute; top:21px; left:0; width:105px;} .menu ul li:hover ul li a.hide {background:#6a3; color:#fff;} .menu ul li:hover ul li:hover a.hide {background:#6fc; color:#000;} .menu ul li:hover ul li ul {display: none;} .menu ul li:hover ul li a {display:block; background:#ddd; color:#000;} .menu ul li:hover ul li a:hover {background:#6fc; color:#000;} .menu ul li:hover ul li:hover ul {display:block; position:absolute; left:105px; top:0;} .menu ul li:hover ul li:hover ul.left {left:-105px;} </style> css"> .menu ul li a.hide, .menu ul li a:visited.hide {display:none;} .menu ul li a:hover ul li a.hide {display:none;} .menu ul li a:hover {color:#fff; background:#36f;} .menu ul li a:hover ul {display:block; position:absolute; top:21px; left:0; width:105px;} .menu ul li a:hover ul li a.sub {background:#6a3; color:#fff;} .menu ul li a:hover ul li a {display:block; background:#ddd; color:#000;} .menu ul li a:hover ul li a ul {visibility:hidden;} .menu ul li a:hover ul li a:hover {background:#6fc; color:#000;} .menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:105px; top:0; color:#000;} .menu ul li a:hover ul li a:hover ul.left {left:-105px;} </style> <style type="text/css"> /* common styling */ .menu {font-family: arial, sans-serif; width:750px; position:relative; margin:0; font-size:11px; margin:50px 0;} .menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000;width:104px; height:20px; text-align:center; color:#fff; border:1px solid #fff; background:#710069; line-height:20px; font-size:11px; overflow:hidden;} .menu ul {padding:0; margin:0;list-style-type: none; } .menu ul li {float:left; margin-right:1px; position:relative;} .menu ul li ul {display: none;} /* specific to non IE browsers */ .menu ul li:hover a {color:#fff; background:#36f;} .menu ul li:hover ul {display:block; position:absolute; top:21px; left:0; width:105px;} .menu ul li:hover ul li a.hide {background:#6a3; color:#fff;} .menu ul li:hover ul li:hover a.hide {background:#6fc; color:#000;} .menu ul li:hover ul li ul {display: none;} .menu ul li:hover ul li a {display:block; background:#ddd; color:#000;} .menu ul li:hover ul li a:hover {background:#6fc; color:#000;} .menu ul li:hover ul li:hover ul {display:block; position:absolute; left:105px; top:0;} .menu ul li:hover ul li:hover ul.left {left:-105px;} </style> css"> .menu ul li a.hide, .menu ul li a:visited.hide {display:none;} .menu ul li a:hover ul li a.hide {display:none;} .menu ul li a:hover {color:#fff; background:#36f;} .menu ul li a:hover ul {display:block; position:absolute; top:21px; left:0; width:105px;} .menu ul li a:hover ul li a.sub {background:#6a3; color:#fff;} .menu ul li a:hover ul li a {display:block; background:#ddd; color:#000;} .menu ul li a:hover ul li a ul {visibility:hidden;} .menu ul li a:hover ul li a:hover {background:#6fc; color:#000;} .menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:105px; top:0; color:#000;} .menu ul li a:hover ul li a:hover ul.left {left:-105px;} </style> ' src="页面中有一个可弹出下拉框的div D1 和下拉框本体div D2鼠标移动到我身上出现下拉框我是下拉框接下来是CSS.D1{width:100px;height:50px;background-color:green;position:relative; } .D2{height:300px;width:100px;background-color:aqua;position:absolute; top:50px;left:0px;display:none;}.D1:hover .D2{display:inline-block；}思路其实就是下拉框一开始是隐藏的 你可以通过hover也行或者js的事件也行 隐藏变成不隐藏 透明变成不透明 还可以加一些动画 翻转效果 让下拉框出现的更惊艳。
4.Css下拉菜单怎么做
原理hover，二级先设置样式是display:none；，当一级的元素处于：hover鼠标移上的时候，二级的元素就display:block；，二级就会显示出来了。
一级二级1二级2二级3cssli{padding:0;margin:0;list-style:none;}li ul{display:none;}li:hover ul{display:block；}大概是这样，更齐全的代码，你问度娘要：CSS下拉菜单，可以找到纯CSS的或者JS,JQ的，。
2级下拉菜单怎么写
1.二级下拉菜单怎么写
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
<html xmlns="
<head>
<meta ; charset=utf-8" />
<title>UL LI</title>
<style type="text/css">
ul li{cursor:pointer; list-style:none;}
</style>
</head>
<body>
<ul>
<li onm ouseover="javascript:document.getElementById('a').style.display='block'" onm ouseout="javascript:document.getElementById('a').style.display='none'">abcdefghijk
<ul style="display:none" id="a">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</li>
<li onm ouseover="javascript:document.getElementById('b').style.display='block'" onm ouseout="javascript:document.getElementById('b').style.display='none'">mnopqrstuvw
<ul style="display:none" id="b">
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>81</li>
<li>82</li>
</ul>
</li>
</ul>
</body>
</html>
这是简单的js+css事例，你慢慢参考.
2.EXCEL怎么做2级下拉菜单啊
先做张基础表
全选A列，在名称框输入“大类”两字，将A列取名“大类”，
再将C列取名水果，D列取名蔬菜……
在A列输入水果、蔬菜……（注意，输入的类别一定要和后面列的名称相同，实质上输入的是后面各列的名称）
在C列输入苹果、橘子……
在D列输入青菜、黄瓜……
进正式表A2，数据/有效性，在来源中输入
=INDIRECT（"大类"）
在B2，数据/有效性，在来源中输入
=INDIRECT(A2)
再将A2和B2单元格分别下拉即可
再有不明白可发消息
3.excel下拉菜单二级菜单怎么做
操作步骤：
1
首先看一下原始数据，原始信息在一张工作表，第一行是省市名称，下面的若干行为对应省市下面的地名和区名。需要在另外一张工作表中A列和B列建立联动的二级下拉菜单。
2
首先，选中原始表的所有数据（包括多余的空白单元格），按F5或者Ctrl+G调出定位对话框。选择左下角的【定位条件】。
3
如下图，选则【常量】，并点击【确定】按钮。这样，所有的非空单元格被选中。
选择功能区的【数据】-【有效性】-【根据所选内容创建】。
由于标题在第一行，因此选择【首行】为名称，然后点击【确定】按钮。
操作完毕后，在名称管理器中就可以看到定义的名称了。
选中第一行的省市名称（也定位到非空白单元格），在名称框中输入“省市”两个字，然后按回车，这样就定义了一个“省市”的名称。
选中操作界面的A2单元格，选择【数据】-【数据有效性】。
如下图，选择【序列】，【来源处】输入：=省市，然后点击【确定】按钮。
这样，就在A2单元格生成了省市信息的下拉菜单。
同样的方法，选中B2单元格，设置数据有效性，输入公式：=INDIRECT($A$2)。
设置完毕后，A2单元格选择“河北”时B2的下拉菜单返回“河北”的信息；A2单元格选择“北京”时B2的下拉菜单返回“北京”的信息。
注意：
上述二级下拉菜单设置的公式采取了行列都绝对引用，如果要使二级下拉菜单对整列均可用，将公式更改为：=INDIRECT($A2)即可。
4.excel一级二级下拉菜单怎么做
软件版本：Office2007
制作方法如下：
1.先准备好数据，一列为一级下拉菜单内容，其余为一级对应的二级内容，一级有几个数据，对应就有几列二级数据，且第一个单元格一定是一级数据中的内容。选择第一列二级数据，点击公式中的名称管理器右边，”根据所选内容创建“名称管理器：
2.在新对话框中，保证勾选的是首行，点击”确定“：
3.同样的道理，创建后面几列的名称，创建完成，点击名称管理器，会看到如下所示名称：
4.选择一级下拉菜单区域，点击数据，数据有效性：
5.选择序列，来源选择第一列，点击确定：
6.选择二级下拉菜单区域，点击数据，数据有效性：
7.选择序列，来源中输入公式如下，点击确定：
8.这样，二级联动数据有效性就做好了：
5.wps二级下拉菜单怎么做
列出数据源，把你所需要的菜单选项分类列出来。
在公式栏里找到，名称管理后面的“指定”
选取你所列出的数据源，单击指定。选择“首行”。
选择你列出数据分类类别的一列，单击名称管理。
在名称管理内输入“类别”，再单击“确定”。
选择类别下的单元格，再点击数据有效性。
在允许里选择“序列”，在来源里输入“=类别”，再点击“确定”。
OK！一级下拉菜单就做好了！
下面我们做二级下拉菜单。
选择下一个单元格，点击数据有效性，在来源里输入“=INDIRECT($A2)”。
单击“确定”，二级下拉菜单就做好了。
6.2013excel 二级下拉菜单怎么做
如图：是我们的演示数据，我们四个省市，和这四个省市内的几所大学，我们完成的效果是先选择省市，省市选择完成后，学校的选择框里就只会有当前选择省市的高校。如图：
首先，我们做一级菜单。
在Excel空白地方点击鼠标右键，选择“定义名称”
在弹出的对话中输入要定义的名称“Province”，在“引用位置”框中输入公式
=OFFSET($A$2,0,0,COUNTA(A$2:A$1048576))
（公式具体参数的含义在以前的讲解中已经介绍过，此处不再赘述，不明白的可以参考以前经验讲解）
然后选择一级菜单对应的单元格，依次点击【数据】-【数据验证】（2013以下版本为【数据有效性】），在弹出的对话框中将“允许”设置为“序列”，“来源”设置为“=Province”。
确定后一级菜单就完成了。下面进行二级菜单的设置。
同样选择“定义名称”，将名称设置为“College”，引用位置中输入公式：
=OFFSET($A$1,MATCH($I$5,Province,0),1,,COUNTA(OFFSET($B$1:$E$1,MATCH($I$5,Province,0),)))
下面着重介绍一下公式中的具体参数的含义。
$A$1：偏移的起始位置，绝对引用，因为其会被作为基准，从第一个单元格开始。
MATCH($I$5,Province,0)：查找出一级菜单所选定的内容在Province名称中的位置。
1：向下偏移一行
COUNTA(OFFSET($B$1:$E$1,MATCH($I$5,Province,0)，））：整句意思为偏移的高度。
分开后的解释：
OFFSET($B$1:$E$1,MATCH($I$5,Province,0)，）：只作行偏移，没有列偏移
$B$1:$E$1：第二个偏移的起始位置，绝对引用，因为其会被作为基准。
MATCH($I$5,Province,0)：查找出一级菜单所选定的内容在Province名称中的位置。
然后选择二级菜单对应的单元格，依次点击【数据】-【数据验证】（2013以下版本为【数据有效性】），在弹出的对话框中将“允许”设置为“序列”，“来源”设置为“=College”。完成的效果如图
7.excel下拉一级二级菜单怎么做
一、Excel一级下拉菜单制作
例如在A1:A10单元格制作一个下拉列表菜单，步骤如下：
选中A1:A10单元格，选择“数据—有效性”，进行如图所示设置即可，其中来源中的每一项要用英文逗号隔开。
设置好以后，在A1:A10单元格就能进行下拉选择了，
二、Excel二级下拉菜单制作
例如在A1:A10和B1:B10单元格制作二级联动下拉列表菜单，步骤如下：
1、在表中输入需联动下拉选择的信息，如图所示（其中省份是一级下拉选项，市名是二级下拉选项）：
2、选中E1:F1单元格，选择“插入—名称—定义”，输入名称如“省份”，
3、选中E1:F3单元格，选择“插入—名称—指定—首行”
4、选中A1:A10单元格，选择“数据—有效性”，进行如图所示设置即可，其中来源中输入=省份
5、选中B1:B10单元格，选择“数据—有效性”，进行如图所示设置即可，其中来源中输入=INDIRECT($A1)
设置好以后，在A1:A10和B1:B10单元格就能实现联动下拉选择了
三、Excel三级下拉菜单制作
例如在A1:A10和B1:B10和C1:C10单元格制作三级联动下拉列表菜单，步骤如下：
1、在表中输入需联动下拉选择的信息，如图所示（其中省份是一级下拉选项，市名是二级下拉选项，县名是三级下拉选项）：
2、选中E1:F1单元格，选择“插入—名称—定义”，输入名称如“省份”，
3、选中E1:F3单元格，选择“插入—名称—指定—首行”
4、选中E5:H7单元格，选择“插入—名称—指定—首行”，
5、选中A1:A10单元格，选择“数据—有效性”，进行如图所示设置即可，其中来源中输入=省份
6、选中B1:B10单元格，选择“数据—有效性”，进行如图所示设置即可，其中来源中输入=INDIRECT($A1)
7、选中C1:C10单元格，选择“数据—有效性”，进行如图所示设置即可，其中来源中输入=INDIRECT($B1)
设置好以后，在A1:A10和B1:B10和C1:C10单元格就能实现联动下拉选择了，
四、Excel多级下拉菜单制作
按以上步骤能够很简单地制作出三级以上联动下拉菜单的制作。
8.wps表格中二级下拉菜单怎么做
参考我之前的回答，是用Excel编辑的。操作方法接近：
1、选A1——菜单栏——数据——有效性——设置——允许：序列——来源：剪刀，橡皮——确定；（A1下拉就有剪刀或橡皮了）
2、C1~C3分别输入：红色、黑色、黄色——选C1~C3——名称框输入：剪刀——回车；
3、D1~D3分别输入：方形、圆形、三角形——选D1~D3——名称框输入：橡皮——回车；
4、选B1——菜单栏——数据——有效性——设置——允许：序列——来源：=INDIRECT(A1)——确定。
好了，当A1下拉是剪刀，B1下拉就只能选择红色、黑色、黄色；……。
/question/692897667767424924
9.请教高手,我想做一个EXCEL中的二级下拉菜单,如何做
试试、看看，COPY的另外一个类似的回答，你可以依葫芦画瓢，步骤就这样了
设置“数据”表
A列 B列
部门员工
A 张三 李四
B 王二 郑大
C 刘一 王五
D 初一 赵钱
……
命名：
选中A列，在“名称框”中输入“部门”，回车确认。
选中B列，在“名称框”中输入“员工”，回车确认。
在“菜单”表制作下拉菜单：
制作一级下拉菜单
选中A1:B1单元格区域；
执行“数据/有效性”命令，打开“数据有效性”对话框；
在“设置”选项卡下，“允许”选择“序列”、“来源”中输入“部门，员工”（不含引号，用英文逗号分隔）；
选中“忽略空值”、“提供下拉箭头”，单击“确定”按钮，完成一级下拉菜单制作。
此时在A1、B1中，单击右侧的下拉按钮进行选择输入。
制作二级下拉菜单
从A2单元格起向下选中单元格区域；
执行“数据/有效性”命令，打开“数据有效性”对话框；
在“设置”中，“允许”选择“序列”、“来源”中输入公式“=INDIRECT(A$1)”;
选中“忽略空值”、“提供下拉箭头”，单击“确定”按钮，完成“部门”的二级菜单制作。
同法制作“员工”的二级菜单。此时“来源”中输入公式“=INDIRECT(B$1)”。
此时在部门、员工下面的单元格中，单击右侧的下拉按钮进行“部门”、“员工”的选择输入。
下拉菜单怎么写
1. html下拉菜单怎么写
方法如下：方法一：HTML1、创建CSS菜单的HTML代码框架。
我们使用class=“nav”属性的'div'标签作为菜单的容器。在截图中，在图示的HTML代码中，一个简单的无序列表（ul）来表示主菜单项。
2、在主菜单区域中添加链接。在本步骤中，在无序列表（ul）每一项上添加链接。
3、在“关于我们（About Us）”下方LI标签内添加一个无序列表，它代表其子菜单的链接。4、在HTML代码中添加样式表链接。
目前我们已经完成了HTML代码，其内容是一个清晰的菜单和子菜单的层次布局结构。我们使用外置的CSS样式表，因此需要在代码的'head'区域添加样式表链接。
方法二：CSS1、创建CSS文件。完成HTML框架代码后，我们需要使用样式表来实现下列菜单功能。
我们使用CSS选择器来定位HTML中的菜单项，因此无需在HTML中添加额外的ID或class属性。我们通过UL内嵌UL的方式来定位子菜单，并使用display:none；属性 将其隐藏。
在鼠标悬停在LI元素上时，我们需要将其转换为block模式，重新显示相应的子菜单，而>命令可以定位鼠标悬停位置的LI元素。2、使用CSS样式表显示主菜单。
position:relative；声明让子菜单根据主菜单相对位置显示。display:inline-block；声明可以将菜单调整到合适宽度。
3、设置鼠标悬停时的字体渐变颜色。图示中的代码在悬停时，将链接变为深色渐变背景和白色文字的字体。
4、使用样式表显示子菜单。当前子菜单样式继承主菜单元素。
我们要让子菜单项垂直显示在主菜单项下方。5、定位下拉菜单，并将菜单项对齐。
这将会同时去除灰色背景。position:relative；声明必须添加到列表项顶端。
position:absolute；声明必须添加到相对位置定位的列表中。下拉菜单 在计算机应用中，下拉式选单是选单的一种表现形式。
具体表现为：当用户选中一个选项后，该选单会向下延伸出具有其 他选项的另一个选单。下拉式选单通常应用于把一些具有相同分类的功能放在同一个下拉式选单中，并把这个下拉式选单置于主选单的一个选项下。
下拉菜单内的项 目可以据需要设置为多选或单选，可以用来替代一组复选框（设置为多选）或单选框（设置为单选）。这样比复选框组或单选框组的占用位置小，但不如它们直观。
2. 下拉菜单怎么写样式
给你看看这段代码：
这样写<body> <select name="year" style= "width:120px " > <option value="89" >1989</option> <option value="88">1988</option> <option value="89" selected="selected">1989</option> <option value="90">1990</option> </select>；年 </body>
3. html下拉菜单怎么写
方法如下： 方法一：HTML1、创建CSS菜单的HTML代码框架。
我们使用class=“nav”属性的'div'标签作为菜单的容器。在截图中，在图示的HTML代码中，一个简单的无序列表（ul）来表示主菜单项。
2、在主菜单区域中添加链接。在本步骤中，在无序列表（ul）每一项上添加链接。
3、在“关于我们（About Us）”下方LI标签内添加一个无序列表，它代表其子菜单的链接。4、在HTML代码中添加样式表链接。
目前我们已经完成了HTML代码，其内容是一个清晰的菜单和子菜单的层次布局结构。我们使用外置的CSS样式表，因此需要在代码的'head'区域添加样式表链接。
方法二：CSS1、创建CSS文件。完成HTML框架代码后，我们需要使用样式表来实现下列菜单功能。
我们使用CSS选择器来定位HTML中的菜单项，因此无需在HTML中添加额外的ID或class属性。我们通过UL内嵌UL的方式来定位子菜单，并使用display:none；属性 将其隐藏。
在鼠标悬停在LI元素上时，我们需要将其转换为block模式，重新显示相应的子菜单，而>命令可以定位鼠标悬停位置的LI元素。2、使用CSS样式表显示主菜单。
position:relative；声明让子菜单根据主菜单相对位置显示。display:inline-block；声明可以将菜单调整到合适宽度。
3、设置鼠标悬停时的字体渐变颜色。图示中的代码在悬停时，将链接变为深色渐变背景和白色文字的字体。
4、使用样式表显示子菜单。当前子菜单样式继承主菜单元素。
我们要让子菜单项垂直显示在主菜单项下方。5、定位下拉菜单，并将菜单项对齐。
这将会同时去除灰色背景。position:relative；声明必须添加到列表项顶端。
position:absolute；声明必须添加到相对位置定位的列表中。下拉菜单在计算机应用中，下拉式选单是选单的一种表现形式。
具体表现为：当用户选中一个选项后，该选单会向下延伸出具有其 他选项的另一个选单。下拉式选单通常应用于把一些具有相同分类的功能放在同一个下拉式选单中，并把这个下拉式选单置于主选单的一个选项下。
下拉菜单内的项 目可以据需要设置为多选或单选，可以用来替代一组复选框（设置为多选）或单选框（设置为单选）。这样比复选框组或单选框组的占用位置小，但不如它们直观。
4. 下拉菜单怎么写样式
给你看看这段代码：<！DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " 1/DTD/xhtml1-transitional.dtd">
<meta ; charset=gbk" />