<html>
<head>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".flip").click(function(){
$(".panel").slideToggle("slow")
})
})
</script>
<style type="text/css">
div.panel,p.flip
{
margin:0px
padding:5px
text-align:center
background:#e5eecc
border:solid 1px #c3c3c3
}
div.panel
{
height:120px
display:none
}
</style>
</head>
<body>
<p class="flip">请点击这里</p>
<div class="panel">
<p>你可以学习下jquery！</p>
<p>不会的在找我！谢谢！</p>
</div>
</body>
</html>
纯CSS的下拉菜单，此处理解的意思就是标签套
标签，然后再给
标签设置样式。在被套的
标签设置平时状态为隐藏，再等鼠标移动到上一个
标签时，将被套的
标签显示（样式：overflow:hidden
）。
贴一段网上摘的纯CSS下拉菜单（二级）
利用float制作兼容ie6纯css下来菜单
*
{
margin:0
padding:0
}
ul
{
list-style:none
}
a:hover
{color:#555
}
.nav
{
float:left
overflow:hidden
text-align:center
font-size:14px
}
.nav
dd
{
float:left
width:300px
margin:-888px
-150px
0
0
}
.nav
dd
a
{
float:left
margin-top:888px
display:block
position:relative
background:#eee
width:150px
height:30px
line-height:30px
border-bottom:1px
solid
#fff
}
.nav
a:hover
{
margin-right:1px
background:#3cf
}
.nav
dd
ul
{
float:left
font-size:0
z-index:888
}
.nav
dd
li
a
{
clear:left
width:150px
margin-top:0
font-size:14px
}
.nav
dd
li
a:hover
{
margin-right:1px
}
首页
关于我们
公司简介
公司文化
企业荣誉
联系我们
新闻动态
国内新闻
国外新闻
产品展示
111
222
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<style>标签中，输入css代码：select { width: 210px}。
3、浏览器运行index.html页面，此时网页下拉列表的大小被调整为了210px。
