0

我制作了一个下拉菜单，虽然它工作正常并且行为与我想要的完全一样，但有一个问题我似乎无法纠正。

对于一些下拉菜单，我会在下面添加一些评论以帮助用户。例如 ：

<a href="/#"><b>test</b> <br/><span>testing comment</span></a>

我不想将评论放在锚内，而是将其放在锚外并以相同的方式进行外观/行为。推理......谷歌让我害怕，我不希望他们认为我是关键字填充......特别是因为下拉菜单最初是显示：隐藏。我在想类似的东西：

<a href="/#"><b>test</b></a> <br /><span>testing comment</span></

一定有可能，但我似乎无法理解。这个小提琴的完整代码和 css - jsfiddle

<div class="drop-menu">
                <ul>
                    <li><a class="full" href="/#">number 1</a>
                        <ul>
                            <li><a href="/#"><b>test</b> <br/><span>testing comment</span></a></li>
                            <li><a href="/#"><b>test</b> <br/><span>testing comment</span></a></li>
                            <hr/>
                            <li><a href="/#"><b>testing</b> <br/><span>testing comment</span></a></li>
                        </ul>
                    </li>
                    <li><a href="/#">number 2</a></li>
                    <li><a class="purchase" href="/#"><img alt="cart" height="16" src="/images/trans.gif" width="16"> number 3</a></li>
                    <li><a class="full" href="/#">number 4</a>
                        <ul>
                            <li><a href="/#">testing</a></li>
                            <li><a href="/#">testing</a></li>
                            <li><a href="/#">testing</a></li>
                        </ul>                   
                    </li>
                    <li><a href="/#">number 5</a></li>
                </ul>
</div>
4

1 回答 1

0

你可以这样做：

<li><a href="/#"><b>test</b></a><span>testing comment</span></li>

当您将鼠标悬停在li背景上时也会产生相同的效果。

.drop-menu li ul li:hover {
  background:#c4dcec;
  overflow: hidden;
  display: block;
}
于 2013-01-12T19:53:12.690 回答