HTML 屬性：size
size 屬性定義了 <input> 元素的寬度以及 <select> 元素的高度。對於 input 元素，它定義了使用者代理允許使用者在編輯值時看到的字元數。對於 select 元素，它定義了應向用戶顯示的選項數量。此值必須是一個大於零的有效非負整數。
如果沒有指定 size，或者指定了無效值，則該輸入沒有宣告尺寸，並且表單控制元件將具有使用者代理的預設寬度。如果 CSS 使用影響寬度的屬性定位該元素，則 CSS 具有優先權。
size 屬性對約束驗證沒有影響。
試一試
<label for="firstName">First Name:</label>
<input id="firstName" name="firstName" type="text" size="10" />
<label for="lastName">Last Name:</label>
<input id="lastName" name="lastName" type="text" size="20" />
<label for="fruit">Favorite fruit:</label>
<select id="fruit" name="fruit" size="2">
<option>Orange</option>
<option>Banana</option>
<option>Apple</option>
</select>
label {
display: block;
margin-top: 1rem;
}
示例
透過在某些輸入型別上新增 size，可以控制輸入的寬度。在 select 上新增 size 會改變高度，定義在摺疊狀態下可見的選項數量。
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>
規範
| 規範 |
|---|
| HTML # attr-select-size |
| HTML # attr-input-size |
瀏覽器相容性
html.elements.select.size
載入中…
html.elements.input.size
載入中…