2

我有引导导航栏

<ul class="nav nav-list">
    <li class="hidden-phone">
        <a class="nav-link" id="nav-welcome" href="/welcome">
            <i class="icon-coffee visible-phone"></i>
            <span>Welcome</span>
        </a>
    </li>


    <li>
        <a class="nav-link active" id="nav-index" href="/">
            <i class="icon-home visible-phone"></i>
            <span class="hidden-phone">Home</span>
        </a>
    </li>


    <li class="hidden-phone">
        <a class="nav-link" id="nav-prospects" href="/prospects">
            <i class="icon-time visible-phone"></i>
            <span>Prospects</span>
        </a>
    </li>


    <li>
        <a class="nav-link" id="nav-contacts" href="/contacts">
            <i class="icon-leaf visible-phone"></i>
            <span class="hidden-phone">Contacts</span>
        </a>
    </li>
</ul>

CSS

.nav li a {
    padding: 8px 8px 8px;
    margin-right: 10px;
    font-size: 1em;
    line-height: 2em;
    text-align: center;
    color: #E1E5E5;
    text-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1);
}

如果我单击除了 span 元素的最后一个单词之外的导航，则该链接有效。可以说，如果我单击“联系人”链接上的“s”，它就不起作用。

4

0 回答 0