Question

我正在尝试使用css在html中设置标记样式。它适用于Firefox，但不适用于chrome。这是我在样式表单中使用的代码。通过互联网引用一些我用过！重要;命令以及此样式表。但它没有奏效。

.style {
   display: block;
   border: none;
   color: #333;
   background: transparent;
   border-bottom: 1px dotted gray;
   padding: 5px 2px 0 2px;
   width:300px;
   font-size: 14;
   color:#FFF; 
 }

.style:focus{  
   outline: none;
   border-color: #51CBEE;
 }

Answer 1

简单地？你不能。

Firefox允许你在<select>上做一些样式，但不是浏览器的一致性。

如果您真的希望<select>设置为横向浏览器样式，那么您应该使用JavaScript屏蔽解决方案。

也许Chosen或Selectize可以为您提供帮助。

Answer 2

不幸的是，还没有一种跨浏览器兼容的样式表单元素与CSS的路径：通常不会让设计师控制它们的外观/行为，因此表单元素非常难以设计。许多浏览器根本不允许你设置它们的样式！

如果您需要在所有浏览器中获得一致的外观，唯一的途径是使用JavaScript将样式化的HTML元素替换为视图中的表单元素。

这篇文章列出了一些可供选择的选项：http://www.jquery4u.com/plugins/10-jquery-selectboxdrop-down-plugins/

我正在尝试使用css在html中设置<select>标签。它适用于Firefox，但不适用于chrome </select>

2 个答案: