简体繁体 English

为什么CSS width属性与输入元素一起使用

[英]why css width property is working with input element

原文 2015-08-14 16:54:19 3 1 html/ css/ input/ width

According to CSS docs : 根据CSS 文档：

The width CSS property ... applies to all elements but non-replaced inline elements, table rows, and row groups width CSS属性...适用于所有元素，但不可替换的嵌入式元素，表行和行组

Input is inline element. 输入是内联元素。 So why width property is work with input element? 那么，为什么width属性可以与输入元素一起使用？

1 个解决方案

The exception is for non-replaced inline elements . non-replaced inline elements例外。 Input is a replaced element. 输入是一个替换的元素。

Replaced element 替换的元素

In CSS, a replaced element is an element whose representation is outside the scope of CSS. 在CSS中，替换元素是表示形式超出CSS范围的元素。 These are kind of external objects whose representation is independent of the CSS. 这些是外部对象，其表示独立于CSS。 Typical replaced elements are <img> , <object> , <video> or form elements like <textarea> and <input> . 典型的替换元素是<img> ， <object> ， <video>或<textarea>和<input>类的表单元素。 Some elements, like <audio> or <canvas> are replaced elements only in specific cases. 某些元素，例如<audio>或<canvas>仅在特定情况下才被替换。 Objects inserted using the CSS content properties are anonymous replaced elements. 使用CSS内容属性插入的对象是匿名替换的元素。

CSS handles replaced elements specifically in some cases, like when calculating margins and some auto values. CSS在某些情况下专门处理替换的元素，例如在计算边距和一些自动值时。

Note that some replaced elements, but not all, have intrinsic dimensions or a defined baseline, which is used by some CSS properties like vertical-align. 请注意，某些替换的元素（但不是全部）具有固有尺寸或定义的基线，某些CSS属性（例如，垂直对齐）使用了基线。