据我了解,宽度/填充/边距属性仅适用于块级元素。但是,在 INPUT 和 SELECT 元素上,我可以指定宽度,这是可行的。应该是?
我可以写这样的东西:
<input type="text" style="display:block;" />
但是有必要吗?
谁能解释一下为什么它有效?
据我了解,宽度/填充/边距属性仅适用于块级元素。但是,在 INPUT 和 SELECT 元素上,我可以指定宽度,这是可行的。应该是?
我可以写这样的东西:
<input type="text" style="display:block;" />
但是有必要吗?
谁能解释一下为什么它有效?
实际上,它们并不是真正的内联元素,而是内联块元素。这允许您指定宽度、高度和其他特定于块的属性,而无需中断内联元素的流动。在好的浏览器中,您可以在任何元素上使用“display:inline-block”来实现相同的目的。
规范说:
适用于:所有元素,但未替换的内联元素、表格行和行组
表单控件,例如 input 和 select 元素被替换为内联元素(元素被替换为表单控件 - 它的文本内容不像普通元素那样显示)。
由于它们被替换,它们不是不可替换的,因此宽度属性适用。
表单元素是 HTML/CSS 世界的害群之马——有很多属性不能像普通的 HTML 元素那样工作。
虽然它没有回答您的问题,但您可能会发现以下讨论很有趣: http: //meyerweb.com/eric/thoughts/2007/05/15/formal-weirdness/
从技术上讲,这是特定于浏览器的呈现属性。在这一点上,大多数浏览器确实允许您设置宽度,但不能保证(尤其是在旧浏览器上),您肯定会遇到错误。
输入元素的 W3 规范在技术上使其成为内联元素。内联块甚至不是 W3 规范的一部分,它是 CSS2 的一部分(因此旧浏览器不一致)。
例如,如果您将宽度指定为百分比并将大量文本放入其中,IE 会有一些有趣的错误。
长话短说,它几乎总是安全的,只是不是我见过的任何官方规范的一部分。
如果那不可能发生,你想过吗?引入 INPUT 元素时,没有 CSS。HTML 中绝对需要 INPUT 元素的宽度来创建正确的表单。