HTML 输入框 size 属性

htmlweb developmentfront end technology更新于 2025/7/17 22:04:17

<input> 元素的 size 属性用于设置输入框的宽度。宽度越大,文本框的宽度也越大。您可以为以下输入框类型设置 size 属性:text、search、email、password、tel 和 url。

以下是语法 −

<input size="size_num">

以上,size_num 是您需要设置的输入框宽度(以数字表示)。默认值为 20。

现在让我们看一个实现 <input> 元素 size 属性的示例。 −

示例

<!DOCTYPE html>
<html>
<body>
<h2>Register</h2>
<form action="" method="get">
   Id − <input type="text" name="id" placeholder="Enter UserId here..." size = "25" required><br>
   Password − <input type="password" name="pwd" placeholder="Enter password here..." required><br>
   DOB − <input type="date" name="dob" placeholder="Enter date of birth here..."><br>
   Telephone − <input type="tel" name="tel" placeholder="Enter mobile number here..." required><br>
   Email − <input type="email" name="email" placeholder="Enter email here..." size = "35"><br><br>
   <button type="submit" value="Submit">Submit</button>
</form>
</body>
</html>

输出

在上面的例子中,我们有一些带有按钮的字段 −

<form action="" method="get">
   Id − <input type="text" name="id" placeholder="Enter UserId here..." size = "25" required><br>
   Password − <input type="password" name="pwd" placeholder="Enter password here..." required><br>
   DOB − <input type="date" name="dob" placeholder="Enter date of birth here..."><br>
   Telephone − <input type="tel" name="tel" placeholder="Enter mobile number here..." required><br>
   Email − <input type="email" name="email" placeholder="Enter email here..." size = "35"><br><br>
   <button type="submit" value="Submit">Submit</button>
</form>

现在,假设我们想要一个更大的文本框,即更大的宽度。为此,我们使用 size 属性以数字形式设置宽度 −

<input type="text" name="id" placeholder="Enter UserId here..." size = "25" required>

相关文章


有用资源