使用Bootstrap样式化Asp:下拉列表和Asp:ListItem

本文关键字:Asp ListItem 下拉列表 Bootstrap 使用 样式 | 更新日期: 2023-09-27 18:14:27

只是一个快速的问题,你如何样式Asp:下拉列表和它的ListItem使用bootstrap?

是否与CssClass有关?从系统显示的信息来看,CssClass不是元素listtitem中的有效属性。你能在文本中添加Span类吗?

下面是一个示例代码:

<asp:DropDownList runat="server" id="dropdownrole" data-style="btn-primary" CssClass="dropdown-menu">
                    <asp:ListItem CssClass="btn-primary" Text="-- Select a user to proceed --"></asp:ListItem>
                    <asp:ListItem Text="Admin"></asp:ListItem>
                    <asp:ListItem Text="Student" ></asp:ListItem>
                    <asp:ListItem Text="Teacher"></asp:ListItem>
                </asp:DropDownList>

使用Bootstrap样式化Asp:下拉列表和Asp:ListItem

你试过了吗?
对我来说,添加CssClass="form-control"就足够了

<asp:DropDownList CssClass="dropdown-menu form-control" runat="server" id="dropdownrole" data-style="btn-primary">

我想你在找这个:

<asp:DropDownList runat="server" CssClass="form-control"  id="dropdownrole" >
                    <asp:ListItem Text="-- Select a user to proceed --"></asp:ListItem>
                    <asp:ListItem Text="Admin"></asp:ListItem>
                    <asp:ListItem Text="Student" ></asp:ListItem>
                    <asp:ListItem Text="Teacher"></asp:ListItem>
                </asp:DropDownList>

我认为你不能用bootstrap改变选择样式,请阅读这里的选择部分。(滚动)

问候。

 <asp:ListItem>Allahabad</asp:ListItem>
  <asp:ListItem>Kanpur</asp:ListItem>
  <asp:ListItem>Rewa</asp:ListItem>
  <asp:ListItem>Bhopal</asp:ListItem>
  <asp:ListItem>Indore</asp:ListItem>
  <asp:ListItem>Jabalpur</asp:ListItem>

参考:

http://www.mindstick.com/Blog/639/Dropdownlist%20using%20BootStrap%20in%20ASP%20Net .VgUYlVanJ7Y