如何使用 CSS 拉伸表单提交按钮？

【问题标题】：How to stretch the form submit button using CSS?如何使用 CSS 拉伸表单提交按钮？
【发布时间】：2011-04-04 20:15:58
【问题描述】：

如何使用 CSS 拉伸表单提交按钮？我想在按钮内的文本和按钮左右端之间有某种水平填充。这可能吗？如果可以，怎么做？

也非常感谢使按钮更漂亮（不使用图像）的提示:-)。

【问题讨论】：

【解决方案1】：

CSS：

input[type="submit"] {width: 100%;} /* to stretch all submit buttons to full page width, or use width: 300px; as Sarfraz suggested. */

在 IE6 中不起作用，因为它不读取 type="submit" 选择器，但适用于 IE7/8 和所有其他浏览器。

【讨论】：

【解决方案2】：

您可以像任何其他 HTML 元素一样设置它的样式，例如给它display:block 和width:100%。

【讨论】：

【解决方案3】：

增加按钮的width。

<input type="submit" class="btn" />

CSS：

.btn{
  width:250px; /* adjust value */
}

【讨论】：