Question

在谷歌浏览器中，我有一个选择标记，其中包含在浏览器中查看时使用小写首字母呈现的国家/地区。在所有其他浏览器中，它们都有大写字母。选项标签使用小写的第一个字母进行渲染，但我们使用样式来大写它们。可能是谷歌Chrome不知道如何应用这种风格？我在Chromium问题列表中看到了iFrame中的select的问题;但是，此选择标记不在iFrame中。

从Mozilla查看时的CSS：

.web_form div.form_field select {
  text-transform:capitalize;
}

从谷歌浏览器查看时

CSS：

.web_form div.form_field input[type="text"], .web_form div.form_field input[type="password"], .web_form div.form_field select {
  float: right;
  width: 200px;
  border: solid 1px #7B9EBD;
  text-transform: capitalize;
}

HTML（来自任何浏览器）：

<select id="fld_country" name="fld_country" class="form_field">
    <option value="">Please Choose</option>
    <option value="233" title="US" selected="selected">united states</option>
    <option value="1" title="AF">afghanistan</option>

.......继续

Answer 1

这似乎是Google Chrome中的一个突出错误。你最好用javascript或服务器端解析字符串。

http://groups.google.com/a/chromium.org/group/chromium-bugs/browse_thread/thread/b54006f7a2b5fe5b

http://code.google.com/p/chromium/issues/detail?id=31349

Bug已转载：http://jsfiddle.net/wesbos/SgS85/

Answer 2

这看起来像是你想要改变的选择器：

 .web_form div.form_field select

尝试使其更具体（或更不具体）

像：

 .web_form div.form_field select option

Google Chrome中的select标记显示小写选项

2 个答案: