HTML 属性:size

size 属性定义 <input> 元素的宽度和 <select> 元素的高度。对于 input 元素,它定义用户代理允许用户在编辑值时看到的字符数。对于 select 元素,它定义应向用户显示的选项数。这必须是大于零的有效非负整数。

¥The size attribute defines the width of the <input> and the height of the <select> element. For an input element, it defines the number of characters that the user agent allows the user to see when editing the value. For a select element, it defines the number of options that should be shown to the user. This must be a valid non-negative integer greater than zero.

如果未指定 size,或指定了无效值,则输入没有声明大小,并且表单控件将是基于用户代理的默认宽度。如果 CSS 定位的元素具有影响宽度的属性,则 CSS 优先。

¥If no size is specified, or an invalid value is specified, the input has no size declared, and the form control will be the default width based on the user agent. If CSS targets the element with properties impacting the width, CSS takes precedence.

size 属性对约束验证没有影响。

¥The size attribute has no impact on constraint validation.

Try it

示例

¥Examples

通过在某些输入类型上添加 size,可以控制输入的宽度。在选择上添加大小会更改高度,从而定义在关闭状态下可见的选项数量。

¥By adding size on some input types, the width of the input can be controlled. Adding size on a select changes the height, defining how many options are visible in the closed state.

html
<label for="fruit">Enter a fruit</label>
<input type="text" size="15" id="fruit" />
<label for="vegetable">Enter a vegetable</label>
<input type="text" id="vegetable" />

<select name="fruits" size="5">
  <option>banana</option>
  <option>cherry</option>
  <option>strawberry</option>
  <option>durian</option>
  <option>blueberry</option>
</select>

<select name="vegetables" size="5">
  <option>carrot</option>
  <option>cucumber</option>
  <option>cauliflower</option>
  <option>celery</option>
  <option>collard greens</option>
</select>

规范

Specification
HTML Standard
# attr-select-size
HTML Standard
# attr-input-size

¥Specifications

浏览器兼容性

¥Browser compatibility

html.elements.select.size

BCD tables only load in the browser

html.elements.input.size

BCD tables only load in the browser

也可以看看