5

我正在使用Compass和jQuery设计一个网站。将列表列表样式设置为带有下拉菜单的水平菜单的最佳方法是什么？这种菜单的一个很好的例子可以在这里看到。

4

1 回答 1

6

我创建了一个 mixin，它引入了 Suckerfish 样式跨浏览器下拉菜单所需的所有样式。链接在这里：

https://github.com/adambom/sucker-compass

只需添加对 _suckerfish.scss 的引用：

@import "partials/suckerfish"  
 /* You can put this in any directory. 
    It doesn't have to be partials" */

假设您有一个存储在名为#navigation 的 div 中的无序列表，请将以下 scss 添加到您的主样式表中：

#navigation {
    /* The parameters determine the width of
       the top, and lower level navigation elements, respectively */
    @include suckerfish(10em, 12em);
}

如果要支持 IE6，请确保包含提供的 sfhover.js 文件。之后（确保编译你的项目），你应该有一个工作下拉菜单。4行代码还不错。您应该将任何样式添加到导航声明中的下拉列表中。您可以使用 CSS 或 SCSS。

有关更多信息，请查看 github 存储库中的 README，并且一定要阅读：

http://htmldog.com/articles/suckerfish/dropdowns/

于 2011-03-15T04:20:07.363 回答