如何在没有Javascript的情况下使用下拉菜单制作CSS选项卡？

Question

我需要制作也有下拉菜单的标签，要求是它们必须在没有JavaScript的情况下工作。这是可能的，并且在某个地方有这样的好例子吗？

Answer 1

请参阅此http://www.lwis.net/free-css-drop-down-menu/dropdown.nvidia.com.html

它是纯粹的CSS。看到要理解的源代码。

这是由Free css下拉菜单框架http://www.lwis.net/free-css-drop-down-menu/

构建的

仅适用于IE 6或更早版本的最小JavaScript代码。其他一切都是纯粹的CSS。

如果您在包括IE 6在内的所有浏览器中都需要纯css，请尝试使用

http://www.cssplay.co.uk/menus/new-dropdown.html

但它有一些限制

修改

这也是纯粹的CSS菜单。

http://www.grc.com/menu2/invitro.htm

这包括IE5.x，IE6，IE7的测试版，所有新旧Netscapes，Mozillas，Firefoxes（在PC和Linux平台上），Operas，Safari和许多其他Mac浏览器

Answer 2

这是一个Solution

Answer 3

尝试Suckerfish，Internet Explorer需要使用Javascript，因为旧版本仅支持链接上的：hover 。

Answer 4

基本上你需要在anchor标签上使用hover伪类。为了避免使用javascript，你需要确保导航是结构化的，所以锚点可以这样做，因为ie6这是唯一允许悬停的元素。因此，使用CSS作为关闭状态，您将包含下拉列表的元素设置为display：none，然后在悬停时将其设置为display：block;

实际上相当简单 - 硬位将下拉定位在您想要的位置。