在IE中将css样式添加到选项 | 在IE中将css样式添加到选项

本文介绍了在IE中将css样式添加到选项的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

它适用于mozilla firefox，但不适用于IE和chrome。

 < select class =mapField> 
< option value =1>这是选择列表的选项1< / option> 
< option value =2>这是选择列表的选项2< / option> 
< option value =3>这是选择列表的选项3< / option> 
< / select> 
 
< style> 
 
 select.mapField {
 width：120px; 
} 
 
 .mapField选项{
 overflow：hidden; 
 white-space：nowrap; 
 text-overflow：ellipsis; 
 width：100px; 
} 
 
< / style>

提前感谢。

方案

你不能。 < option> 由操作系统呈现，而不是HTML。除了 background-color ， color 和 border ，style将忽略通过样式对象应用于选项元素的设置。您可以搜索看起来像< select> 的插件，但实际上是可以设置样式的HTML元素。

I want to apply css style to option in select list.

It works perfect in mozilla firefox but does not apply in IE and chrome.

jsfiddle for IE

<select class="mapField">
   <option value="1">This is option 1 of select list</option>
   <option value="2">This is option 2 of select list</option>
   <option value="3">This is option 3 of select list</option>
</select>

<style>

select.mapField{
  width:120px;
}

.mapField option{
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
   width: 100px;
}

</style>

Thanks in advance.

解决方案

You can't. <option> is rendered by the OS, and not HTML. Except for background-color, color and border, style settings applied through the style object for the option element are ignored. You can probably search for plugins that look like <select>, but are actually HTML elements that can be styled.

这篇关于在IE中将css样式添加到选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！