0

如果您可以将鼠标悬停在此处菜单中的“更多”按钮上：http: //jsfiddle.net/H8FVE/7/ 您将看到有一个包含单词Random text here的列表。我试图设置该列表的样式，但不知何故，下拉菜单的样式阻止了我这样做。我用于列表的样式是：

#trendcontainer  {
    margin-top: 0px;
    padding-bottom: 1px;
}

#trend { width: 188px; }

#trend ul
{
    margin-left: 0;
    padding-left: 0;
    list-style-type: none;
    font-family: Arial, Helvetica, sans-serif;
}

#trend film
{
    display: block;
    padding: 3px;
    width: 188px;
    background-color: #B40404;
    border-bottom: 1px solid #eee;
        text-align: center;
    letter-spacing: 0.4px;
    color: #FAFAFA;
}

这是 HTML 的一部分：

<div id="second-menu" class="clearfix">
    <ul id="secondary-menu" class="nav sf-js-enabled">
        <li class="manimation"><a href="" style="width:400px;border-bottom:9px solid #43cf61">Animation</a></li>
    </ul>

<ul id="mega">
    <li class="dif mmore" style="background:none;"><a href="#" style="font-style:italic;border-bottom:9px solid #4b5571">More...</a>
      <div>
    <moretopbar>
    <ul>
        <li class="mgames"><a href="" style="border-bottom:9px solid #e34328">Games</a></li>
        <li class="mliterature"><a href="" style="border-bottom:9px solid #2c8f83">Literature</a></li>
        <li class="marts"><a href="" style="border-bottom:9px solid #cc226a">Arts</a></li>
        <li class="mcontact" style="background:none;"><a href="" style="border-bottom:9px solid #9395aa">Contact</a></li>
    </ul>
    </moretopbar>

<morecontainer>
<moreleftbar>

                <trendcontainer>
                    <trend>
                        <ul>
                            <li><film>Random text here</film></li>
                            <li><film>Random text here</film></li>
                            <li><film>Random text here</film></li>
                            <li><film>Random text here</film></li>
                        </ul>
                    </trend>
                </trendcontainer>

</moreleftbar>

</morecontainer>

      </div>
    </li>
  </ul>
</div> <!-- end #second-menu -->

虽然，我建议忽略小提琴以直观地展示该问题：http: //jsfiddle.net/H8FVE/7/

你能弄清楚如何修复样式吗？如果您选择回答，请详细说明，因为我的编码知识有限 - 最好使用更新的小提琴。

4

1 回答 1

1

我刚刚更新了它。http://jsfiddle.net/H8FVE/11/

我在 css 代码中添加了一个名为 .random 的类，并将 class="random" 添加到您要修改的 ul 元素中。在 css 中我添加了以下代码，尽管您可以更改它来满足您的目的。（如果您只想设置 ul 的样式，请将其更改为 .random { }

.random li {
    font-weight:bold;
}
于 2012-08-15T23:31:13.050 回答