html宽度100 的直线,使用填充样式化HTML FORM元素，宽度为100％

6 个答案:

答案 0 :(得分：5)

您可以在文本字段和textareas上使用box-sizing: border-box;。

它解决了与选择框的区别。

答案 1 :(得分：1)

最好的方法是使用div伪造元素的边框。

First NameAge

注意：此示例中的列表将进行样式设置，以使其不显示为项目符号列表。以这种方式使用列表有助于访问，因为屏幕阅读器将告诉用户列表中包含多少项。

我认为这可能有用，因为它表明你的努力可能有点浪费，试图在表格中布局表格并将所有输入拉伸到相同的长度。

答案 3 :(得分：0)

不是最有用的答案，但是表单元素的CSS样式在浏览器之间是非常不可靠的。像你这样的JavaScript解决方案是最好的选择。

不可靠性的两个原因：

CSS无法描述表单元素的某些功能。 元素就是一个很好的例子：没有任何CSS属性可以描述元素在不同操作系统上的不同方式。

试图弄清楚哪些CSS属性应该影响表单元素，以及如何为浏览器制造商设置一个老鼠的巢，所以他们大多只留下它。 Safari是一个值得注意的例外;见例如http://webkit.org/blog/17/the-new-form-controls-checkbox-2/

您可以争辩说，无论网站所有者的意图如何，表单元素在网站之间应该看起来相同，以便用户知道他们点击了什么。

醇>

答案 4 :(得分：0)

以下CSS适用于Moz Firefox，适用于html输入元素(提交，按钮，文本)，textarea元素甚至选择元素。在我正在尝试的浏览器中，select元素的长度几乎相等。

table {width:100%;}

form input { width: 100%; }

form textarea { width: 100%; overflow-y: scroll; resize: vertical; }

form select { width: 100%; }

答案 5 :(得分：0)

说你的HTML看起来有点像这样：

如何仅使用input和select来设置宽度？

td { width: auto; }

input[type=text] { width: 100px; }

select { width: 100px; }

或者我的问题出错了吗？