我input[type=file]
在我的页面里放了一个。它在 Firefox 和 Chrome 中具有不同的渲染,
- 在 chrome 中,浏览按钮在字段内,而在 Firefox 中,在字段外
- 我用渐变背景设计了该字段的样式,带有灰色边框。但它在 Firefox 中不起作用,但在 Chrome 中看起来不错。
有没有办法使用在给定浏览器中都呈现良好的 CSS 来设置它们的样式?
设置原生表单元素的样式确实很难,但这可能会对您有所帮助: http: //uniformjs.com/
我有一个真正的问题是让 FF 开发人员了解必须在输入框内和框外显示相同颜色的文本是一个问题。输入框上的所有其他文本都显示在输入框的背景下,但 FF22 或 23 文件输入上的文本 - 让我们暂时希望 - 相对于外部“显示”。黑色背景上的黑色文字?
解决方案是在所有输入元素上放置背景颜色,或者只是那些文件类型的元素,即使这只是默认的#FFF,在你的 CSS 中。
input[type="file"] {background-color: #FFF;} or
input {background-color: #FFF;}
将它放在所有浏览器的所有输入上似乎没有害处,因为几乎通用的默认值是输入的白色 BG。没有必要使用类来定位(除非您愿意),因为旧版 FF 和所有其他浏览器使用熟悉的带有浏览按钮的输入框 - 这也允许用户复制和粘贴文件链接,这是一个有用的好处。