在 asp.net 上的 CSS 样式 DropDownList答案

【问题标题】：CSS styled DropDownList at asp.net在 asp.net 上的 CSS 样式 DropDownList
【发布时间】：2013-09-08 21:48:28
【问题描述】：

有没有人有更好的样式 DropDownList 或为 asp:DropDownList 准备好的 css 文件？我在 www 上找不到完成的东西？！

<asp:DropDownList ID="DropDownList1" runat="server" Width="50px">
</asp:DropDownList>

我可以想象像jQuery UI style 这样的东西。

感谢您的建设性回答！

【问题讨论】：

为什么不直接使用免费的 jQuery UI 样式？
我只找到了这个：bavotasan.com/2011/style-select-box-using-only-css
@OndrejJanacek 如何使用或组合 ui 样式？还没用完 class="ui-widget"
@SigiAnonym 在他们的网站上使用主题滚轮，这样您就可以根据需要设置下拉列表的样式，然后下载您的自定义样式并浏览您需要的所有 css 文件。
@OndrejJanacek 我会试试...我希望有人有一个完成的解决方案。

标签： c# jquery asp.net css jquery-ui

【解决方案1】：

.search_categories .select{

  background: transparent;

  line-height: 1;

  border: 0;

  padding: 0;

  border-radius: 0;

  width: 120%;

  position: relative;

  z-index: 10;

  font-size: 1em;

}

【讨论】：

欢迎来到 Stackoverflow。您介意解释一下您的解决方案吗？
不鼓励仅使用代码的答案，因为它们没有说明如何解决问题。请更新您的答案，以解释这如何改进该问题已有的其他已接受和赞成的答案。请查看How do I write a good answer。

【解决方案2】：

试试这个：link

 .dropdown1 {    
    background: url(http://maxgxl.com/max4u/images/selectArrowDown.png) no-repeat 95% center;
    width:150px;
    border: 1px solid #000; 
    overflow: hidden; 
    border-radius:5px;
}
.dropdown1 select {
    border:0px; 
    width:168px; 
    background:none;
}

【讨论】：

【解决方案3】：

我在我的项目中使用了this，看起来不错。

【讨论】：

@Sigi Anonym - 如果这对你有用，请告诉我，我会很高兴的。 :)

【解决方案4】：

您在此处共享的链接似乎是一个组合框。如果您想设计您的下拉列表控件，那么您也可以拥有自己的样式。

想想您在此处给出的相同链接。它包含一个文本框，该按钮的背景图像是一个看起来像下拉列表的小三角形，以及一个简单的 div/list 控件 (ul-li)，其中包含填充在下拉列表下方的所有项目。

现在您需要决定在您的设计中需要包含哪些内容。根据您的要求，您可以在此处自定义下拉列表。

看到这只是您可以创建自己风格的自定义下拉列表的一种方式。如果您选择 jquery 下拉列表，那么您可以拥有与您自己设计的外观和感觉相同的外观。因此，您可以通过下拉列表来决定想要拥有的东西。

谢谢

【讨论】：