bootstrap 3:按钮作为下拉动作

时间:2014-01-27 09:31:58

标签: css twitter-bootstrap twitter-bootstrap-3

你能帮我把按钮设计成标准的下拉链接吗?

<div class="dropdown">
    <button class="btn dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">Dropdown <span class="caret"></span>

    </button>
    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
        <li><a href="#">Dropdown Link</a>
        </li>
        <li>
            <form>
                <button class="btn btn-link">Dropdown Button</a>
            </form>
        </li>
    </ul>
</div>

jsFiddle

1 个答案:

答案 0 :(得分:1)

将此添加到您的CSS:

.dropdown-menu form button {
    border:0;
    padding: 3px 20px;
    color: #333;
    width:100%;
    text-align:left;
}
.dropdown-menu form button:hover {
    color:black;
    text-decoration:none;
    background-color:#f5f5f5;
}

它看起来像一个标准链接。