【问题标题】:Horizontal Lines in Dynamic Navigation动态导航中的水平线
【发布时间】:2010-11-08 22:08:30
【问题描述】:

我需要使用 jQuery 库开发一个垂直导航菜单,该库将提供树视图功能。我遇到问题的技巧是菜单需要是多行的(即自动换行:每个锚点上都是正常的)并且有水平线穿过它。我尝试过的每种方法都会使线条看起来很奇怪,或者树视图的打开/关闭图标显示不正确。我也需要 IE6+ 兼容性。

我将 jsTree jQuery 库用于树视图并将我自己的 CSS 应用到混合中。我尝试了 4 种不同的方法让它工作,但 here is my current attempt。在 Firefox 或 IE8 中查看效果最佳,但其他浏览器存在各种问题。

【问题讨论】:

    标签: jquery css menu navigation jstree


    【解决方案1】:

    你试过了吗

    #leftnav li {
        border-bottom: 1px solid #FFF;
    }
    

    它只是每个<li> 条目底部的基本白色边框。这很简单,但我可能会这样做。根据您选择的<li> 背景颜色,您可能需要改变边框颜色。您甚至可以在定义<li> 标记的每个级别的样式和背景时执行此操作。

    【讨论】:

    • 不幸的是,使用底部边框会产生与我尝试过的其他解决方案相同的问题。主要问题是让它们出现在每个列表项下,同时仍保留子项的缩进。我目前的解决方法是删除所有列表项的填充/边距,然后缩进子图标和锚点,但是 8 之前的 IE 浏览器真的不喜欢这种方法。
    猜你喜欢
    • 2011-08-24
    • 2014-03-01
    • 2011-08-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-02-08
    相关资源
    最近更新 更多