MVC 中的样式下拉列表答案

【问题标题】：Styling drop down list for in MVCMVC 中的样式下拉列表
【发布时间】：2013-06-12 23:30:32
【问题描述】：

您好，我正在尝试使用一些 css 和 javascript 设置下拉列表的样式。我面临的唯一困难是我使用带有 MVC 的模型并且工具不同，所以我没有使用选择标签。

目前这就是我显示和填充下拉列表的方式

<%: Html.DropDownListFor(model => model.teamIdAway, Model.getTeams, new { style = "width: 135px" })%>

并从模型中填充它

谁能告诉我一些基本代码或者我可以做些什么来设置我的下拉列表的样式

谢谢

【问题讨论】：

【解决方案1】：

Html.DropDownListFor 呈现<select>，所以我不知道你为什么说你没有使用<select> 标签。

CSS 不关心服务器端代码，只关心呈现的 HTML，所以如果您遇到问题，请始终向我们展示呈现的 HTML 和您的 CSS。

无论如何，为您的 <select> 元素设置样式（请记住，因为 <select> 是 CSS 中的“替换元素”，所以样式设置的机会是有限的，但您可以做一些很酷的事情：http://bavotasan.com/2011/style-select-box-using-only-css/

您可以覆盖<select> 的id="" 属性，这样您就可以在CSS 中使用元素选择器，如下所示：

<%: Html.DropDownListFor(model => model.teamIdAway, Model.getTeams, new { id = "mySelect" })%>

#mySelect { width: 135px; }

但是，如果您在局部视图中使用此DropDownListFor，则id="" 属性在文档中将不是唯一的，这是非法的。尝试使用利用上下文的不同选择器，例如后代选择器。

【讨论】：