0

我正在尝试在列表上的父 li 标签上使用 Cufon，而在子级别项目上仅使用常规文本。问题是 cufon 将它的风格应用于所有人

  • 项目。有没有办法从 Cufon 中排除子级别的项目？

    我试过 .parent li a:not(.parent li ul li a) 但它似乎不起作用

    • 4

    3 回答 3

    1

    使用直接后代 css 选择器>。这将仅针对该元素的直接子元素。

    jQuery
$('.parent > ul > a')

css
.parent > ul > a {}

html
<ul class="parent">
    <li>
        <a>Cufon Here</a>
        <ul>
            <li><a>No Cufon Here</a></li>
        </ul>
    </li>
</ul>

    有关子选择器的更多信息，请访问 http://www.w3.org/TR/CSS2/selector.html#child-selectors

    于 2010-06-28T15:58:26.727 回答
    0

    找到了这个解决方案，它似乎正在工作：

    ul.parent > li > a

    通过http://groups.google.com/group/cufon/browse_thread/thread/06d09135431f6703

    于 2010-06-28T16:24:42.730 回答
    0

    这将转到您<head>的脚本标签内。确保您的 Cufon 库和字体文件存在并在您的替换方法之前添加。

    <script src="assets/js/plugins/cufon-yui.js" type="text/javascript"></script>
<script src="assets/font/Futura_400.font.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/scripts.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    Cufon.replace('#mainnav > li > a, #sectionnav > li > a, h1',{fontFamily: 'Futura', hover: {color: '#58AD55'}});
</script>

    这个只会选择一个是li的孩子的#mainnav的孩子。只有第一级会被cufon取代。悬停方法可让您定义替换链接将具有的悬停颜色。

    上面的示例将适用于以下 Html：

        <ul id="mainnav">
    <li><a href="#">Replaced by cufon</a>
        <ul>    
            <li><a href="#">Plain Text</a></li>
            <li><a href="#">Plain Text</a></li>
            <li><a href="#">Plain Text</a></li>
        </ul>    
    </li>
    <li><a href="#">Replaced by cufon</a>
        <ul>    
            <li><a href="#">Plain Text</a></li>
            <li><a href="#">Plain Text</a></li>
            <li><a href="#">Plain Text</a></li>
        </ul>    
    </li>
</ul>
    于 2011-02-04T18:32:16.133 回答