我正在寻找在 PC 和 Mac 上的所有浏览器中获取相同表单元素的最佳/有效方法。这听起来像是一个非常基本的问题,我应该知道答案,但有趣的是我无法弄清楚。
一段时间以来,我一直在用 CSS 和偶尔的 JQuery 来设计表单,我从不担心浏览器/计算机之间的细微差别。
但现在我在一个项目中,它们实际上必须是相同的。有任何想法吗?
你不能。复杂表单控件的组件是所谓的影子 DOM的一部分:我们可以看到元素由较小的组件组成,但我们无法设置它们的样式。
按钮或文本(文本、密码、搜索、网址、电子邮件、电话)输入字段等更简单的元素通常可以设置为跨浏览器的外观一致(前提是所述浏览器支持您使用的样式)。
如果您尝试对其进行样式设置,几乎其他所有内容都看起来很奇怪。最严重的违规者是选择和复杂输入(文件、日期、日期时间、时间、颜色、范围、数字等),因为它们由多个元素组成(例如,输入字段和一个或两个按钮)。除非浏览器允许您通过特殊的 CSS 属性设置这些组件的样式(我确定我在 webkit 前缀下看到过一些,但无法告诉您是哪些),否则您无法触摸它们。
您在这里有 3 个选项: