呵呵为什么又来一个破解，为什么是淘宝菜单，因为taobao上面的菜单，可以说是中国第一个大型网站采用css做的滑动门菜单，二来
滑动门有一弱点就是会产生选中链接的虚线线框偏移，而淘宝的菜单是没有虚线框的，哈哈至于怎么做到的我们会在下面分析：

好了长话段说我们先打开taobao的首页看看找到如下代码：

很标准的滑动门菜单结构，至于真正的滑动门菜单技术我们这里不详细介绍，如果你不是很了解的话，可以去看《CSS中的滑动门技术》，我们在查找一下菜单的css

上面就是我提取出来菜单的样式表，哈哈很多代码吧，我们仔细看看根本没有什么刻意特殊的代码在里面，看来用css特殊属性去除线框的可能性排除了，选中菜单链接以后没有虚线通常的做法使用javascript来实现，这个比较常见具体方法可以查看《去除链接虚线框》， 那我们再从新回到页面源代码查看，结果没有发现可疑代码。哪taobao到底是怎么做的呢，我们再回头看看上面的代码，发现在所有文字的两边多了一个标签，大家都知道，做滑动门菜单根本不用这个完全是可以实现，难道就因为的原因才没有虚线框的吗，那么我们把代码下载下来实验一下，吧去掉,看看什么效果，果然去掉的菜单除了虚线框不过虚线框还是不错，没有偏移，好那么我们就来看看这个是什么css属性,怎样起到这个作用的，看下面代码：

传统我们做滑动门菜单通常是吧定义按钮的大小和边距定义在a上和li上，然后在a和li上定义不同的背景文件，最后组合制作成一个按钮，而在这段代码里面大家发现，li和a只定义了高度根本没有定义边距，而且只有a放了按钮左边的图像背景文件，li是空的，而真正定义按钮大小的是span,不仅定义了右边的背景，高度还有两边的边距，还有display:block;和cursor:hand;，哪到底为什么要这么做呢？好下面我们来做一个小实验：

这段代码是没有定义和的，但是采用了同样的结构就是嵌套最后里面是要链接的文字，大家发现虚线框是紧紧包裹在文字周围的，我们继续测试下面代码

www.d8in.com

最后终结一淘宝菜单的制作原理；
1.用

• 控制菜单的总体结构
  2.用增加按钮链接同时加入按钮左侧固定大小的图像；
  3.用控制单个按钮的大小位置等，同时消除点击以后的虚线框。