Mac和PC上所有浏览器的相同表单元素

时间:2013-02-05 13:02:52

标签: jquery html css forms

我正在寻找在PC和Mac上的所有浏览器中获得相同表单元素的最佳/有效方法。这听起来像一个非常基本的问题,我应该知道答案,但有趣的是,我无法弄明白。

我一直在用CSS设置表单和偶尔的JQuery一段时间,我从来不担心浏览器/计算机之间的细微差别。

但现在我正处于一个他们确实必须完全相同的项目。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

你做不到。复杂表单控件的组件是所谓的 shadow DOM 的一部分:我们可以看到该元素由较小的组件组​​成,但我们无法设置它们的样式。

按钮或texty(文本,密码,搜索,网址,电子邮件,电话)输入字段等简单元素通常可以设置为在浏览器中保持一致(假设您使用的样式由所述浏览器支持)。

如果你尝试设计风格,其他一切看起来都很奇怪。最严重的违规者是选择和复杂的输入(文件,日期,日期时间,时间,颜色,范围,数量等),因为它们由多个元素组成(例如输入字段和一个或两个按钮)。除非浏览器授予您通过特殊CSS属性设置这些组件样式的能力(我确定我已经在webkit前缀下看到了一些,但无法告诉您哪些),否则您无法触摸它们。

这里有3个选项:

  • 不要以任何方式设置表单控件的样式,这会导致它删除浏览器的默认样式(以便简单和复杂的控件看起来彼此相似)
  • 根本不要使用复杂的表单控件(即没有文件,选择等)
  • 通过JavaScript
  • 将所有复杂的表单控件替换为简单的控件