更改表单按钮的外观

Question

使用这一点CSS，我的表单按钮现在看起来很扁平（2D），我非常喜欢这个样子：

input {
  border: 1px solid #999;
}

但是，对于文件字段（选择要上传的文件），该按钮仍为3D。然后边界围绕着那个按钮和旁边的文字。

我尝试通过将输入重命名为.input来修复此问题，然后仅将其应用于我的提交/取消按钮，但现在它们看起来像文件字段的外观。那么我该如何解决这个问题呢？它们看起来都很扁平/ 2D？

另外，有没有办法将这些表单按钮创建为普通链接？我很喜欢他们的样子。我正在使用Rails进行编程，所以如果可以发布帮助函数，那就太好了。

Answer 1

这个article解释了设置文件输入按钮的好方法

Answer 2

http://extjs.com/forum/showthread.php?t=29032
该线程使用ExtJS库创建可以设置样式的输入按钮。我不一定会单独使用ExtJS这个原因，但如果你真的想看看他的文件按钮的代码。而不是将文件按钮定位在图像顶部并调整它直到它工作得很好，这个Javascript实际上将按钮放在鼠标所在的任何位置。允许您创建各种形状和大小的极其奇特的按钮。

Answer 3

要将提交按钮创建为普通文本链接，您可以使用Javascript将onclick事件附加到单个单词而不是使用提交按钮。