-1

我有一个问题

<ul class='nav'>            
        <li>
          <a class='' href='index.html'> Home </a>
        </li>

        <li>
            <li class="dropdown">
            <a class="dropdown-toggle" id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
            <ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
              <li><a tabindex="-1" href="#">Action</a></li>
              <li><a tabindex="-1" href="#">Another action</a></li>
              <li><a tabindex="-1" href="#">Something else here</a></li>
              <li class="divider"></li>
              <li><a tabindex="-1" href="#">Separated link</a></li>
            </ul>
          </li>
        </li>
        </ul>

用于此的 CSS 代码

 .topbar div>ul a,  .nav a
  {display:block;float:none;outline: 0;padding:8px 6px 6px;line-height:12px;text-    decoration:none;border-bottom-left-radius:5px;
  border-bottom-right-radius:5px;
  border-top-left-radius:5px;
  border-top-right-radius:5px;}

我只希望这些属性带有 Home 和 DropDown 按钮，我不想让这些属性用于我的选项卡按钮，即 Action、Another Actions 按钮。但是每当我尝试编辑它时，整个事情都会变得一团糟。

请帮我解决这个问题。

4

3 回答 3

3

试试这个代码：

    <li>
      <a class='dropdown-toggle' href='index.html'> Home </a>
    </li>

    <li>
        <li class="dropdown">
        <a class="dropdown-toggle" id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
        <ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
          <li><a tabindex="-1" href="#">Action</a></li>
          <li><a tabindex="-1" href="#">Another action</a></li>
          <li><a tabindex="-1" href="#">Something else here</a></li>
          <li class="divider"></li>
          <li><a tabindex="-1" href="#">Separated link</a></li>
        </ul>
      </li>
    </li>
    </ul>


.dropdown-toggle
{
    display:block;
    float:none;outline: 0;
    padding:8px 6px 6px;
    line-height:12px;
    text-decoration:none;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
}
于 2012-09-29T14:06:22.520 回答
3

你的 html 看起来不对。一次翻倍<li>。

但这里是 CSS：

a{
    outline: 0;
}
ul.nav a{
    display:block;
    padding:8px 6px 6px;
    line-height:12px;
    text-decoration:none;
    border-radius:5px;
}
ul.nav ul a{
    padding:8px 6px 6px;
}
于 2012-09-29T14:32:24.650 回答
2

将选择器更改为： .topbar div>ul li.dropdown > a, .nav a

于 2012-09-29T14:04:57.503 回答