相关疑难解决方法(0)

我正在尝试在Google Chrome option中的select下拉菜单中设置a的样式.它适用于除IE9和Chrome之外的所有浏览器.

option.red {
    background-color: #cc0000; 
    font-weight: bold; 
    font-size: 12px; 
    color: white;
}

<select name="color">
    <option class="red" value="red">Red</option>
    <option value="white">White</option>
    <option value="blue">Blue</option>
    <option value="green">Green</option>
</select>

如果不使用JavaScript,有没有办法为Google Chrome中的选项设置样式？选择后,不显示背景颜色.

我在视图中以下列方式绑定我的模型:

<%=Html.DropDownList("SelectedItem",new SelectList(Model.MyItems,"ItemId","ItemName")) %>

问题是我的项目文本是格式化的文本,在单词之间有空格,如下所示.

#123  First          $234.00
#123  AnotherItem    $234.00
#123  Second         $234.00

我想保留此项文本中的空格,即使它们被添加到DropDownList后也是如此.但不幸的是我的DropDownList显示它们没有空格如下:

#123 First $234.00
#123 AnotherItem $234.00
#123 Second $234.00

当我查看页面的来源时,这些空格是完整的,但在显示中则不是.我试图添加'  '而不是空格但是SelectList(MVC框架类)内部方法在将它们作为项目添加到下拉列表之前使用HtmlEncode.

有什么办法可以实现吗？

在下拉列表中,我需要在列表中的选项前添加空格.我在尝试

<select>
<option>&#32;&#32;Sample</option>
</select>

添加两个空格但不显示空格.如何在选项文本之前添加空格？

虽然我用两个相同的CSS <input>和<select>中,文本<select>被切断,而在输入文本是完美的.为什么会发生这种情况以及如何解决？

input,
select {
  box-sizing: content-box;
  width: 90%;
  height: 23px;
  padding: 10px;
  font-family: TheBoldFont;
  font-size: 27px;
  color: #f26e7c;
  border: 4px solid black;
  border-radius: 12px;
}

<input type="text" value="xxxxxxx">

<select>
  <option selected value="xxxxxxxxx">xxxxxxxx</option>
</select>

这是结果:

这就是在Google Chrome的开发者工具中悬停显示的内容:

html下拉列表中的选项值的css样式不适用于chrome和safari,仅适用于Firefox和IE.

一些代码如下:

<option style="color:#4f5652;background:#f0f0ef;hite-space:nowrap;-webkit-appearance:button;text-overflow:ellipsis; padding:5px 4px 3px 4px;border-bottom:1px solid green" value="project">Project</option>