0

我想为我的 asp 下拉列表设置样式,但我在网上找到的所有解决方案都与带有选择元素的下拉列表相关。现在我目前正在使用 bootstrap 来尝试获得如下所示的输出,但我也可以使用 css 和 jquery 等其他方法,只要我能实现如下所示的输出。

这是我目前的输出:

在此处输入图像描述 这是我想要实现的输出: 在此处输入图像描述 这是我的代码:

    //aspx file
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <script src="Scripts/jquery-1.8.0.min.js"></script>
    <script src="Scripts/bootstrap-select.min.js"></script>
    <link href="Content/bootstrap-select.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"/>

<script type="text/javascript">

    $(document).ready(function () {

        $(".form-control").form - control();

    });

</script>

            <asp:DropDownList ID="DropDownList" runat="server" Width="136px" OnSelectedIndexChanged="ddl_SelectedIndexChanged" AutoPostBack="True" ForeColor="Black" CssClass="form-control"> 

谢谢你的帮助!!

4

1 回答 1

0

正如我之前所说,这是一个按钮下拉,你试图实现你必须将引导类btn btn-default添加到你的下拉列表中:

<asp:DropDownList ID="DropDownList" runat="server" Width="136px" OnSelectedIndexChanged="ddl_SelectedIndexChanged" AutoPostBack="True" ForeColor="Black" CssClass="btn btn-default form-control">

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select class="btn btn-default">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

我为你创建了一支笔来测试在这里测试

于 2015-10-27T18:34:48.330 回答