在做导航菜单设计制作的时候，很常见的有下拉列表式菜单。如下图效果，但是这种下拉菜单一般都是使用JavaScript + Css联合打造，下面讲一种不使用JavaScript一样能做出的方法。[css hack drop down list navigation menu]
img如图，鼠标移到主菜单上，显示下拉列表，鼠标移开，则下拉菜单隐藏。
先把HTMLCode贴出来再慢慢分析讲解，Dom代码如下：
可以看到，在HTML代码中使用了IE选择符。
关于<!--[if lte IE 6]> <![endif]-->标记的详细说明请看前一篇随笔，有详细说明，在这里就简单说一下，if lte IE6 的意思是只有IE6和IE以下的IE版本浏览器可见。这是IE特有属性，其他浏览器看不到。（也只有IE6需要hack一下，不然这个代码就perfect 了）
在由于要区分IE6以及IE6一下版本浏览器，和现在的主流浏览器，所系我们需要用到两个css。
这连个css引用要写在页面<head></head>之间，并且顺序为ulmenu.css在上，IE6及以下能识别的ulmenu2.css在下面，为了的是大部分浏览器只需要读取ulmenu.css即可，IE6及以下浏览器才需要读取ulmenu2.css >
<!--[if lte IE 6]>
<a href="../wang-luo-ying-xiao.html">网络营销
<table><tr><td>
<![endif]-->
<a href="../wang-luo-ying-xiao.html">网络营销
<table><tr><td>
<![endif]-->
关于<!--[if lte IE 6]> <![endif]-->标记的详细说明请看前一篇随笔，有详细说明，在这里就简单说一下，if lte IE6 的意思是只有IE6和IE以下的IE版本浏览器可见。这是IE特有属性，其他浏览器看不到。（也只有IE6需要hack一下，不然这个代码就perfect 了）
在由于要区分IE6以及IE6一下版本浏览器，和现在的主流浏览器，所系我们需要用到两个css。
<link href="css/ulmenu.css" rel="stylesheet" type="text/css" />
<!--[if lte IE 6]>
<link href="css/ulmenu2.css" rel="stylesheet" type="text/css" />
<![endif]-->
<!--[if lte IE 6]>
<link href="css/ulmenu2.css" rel="stylesheet" type="text/css" />
<![endif]-->
这连个css引用要写在页面<head></head>之间，并且顺序为ulmenu.css在上，IE6及以下能识别的ulmenu2.css在下面，为了的是大部分浏览器只需要读取ulmenu.css即可，IE6及以下浏览器才需要读取ulmenu2.css >
经测试。IETest测试，兼容IE6.7.8.FF.Safari.
代码中所需配图，提供Demo下载（明天整理之后再修改，本例可以参看网站 http://fee.magnfee.com 导航菜单，技术贴，请勿讨论网站内容，仅仅探讨相关技术。QQ：31-52-6加时去掉横杠，注明cnblogs，嘿嘿 ）。