Thuộc tính size của phần tử <input> được dùng để đặt chiều rộng của ô nhập liệu. Chiều rộng càng lớn thì hộp văn bản (textbox) càng rộng. Bạn có thể đặt thuộc tính size cho các kiểu input sau: text, search, email, password, tel và url.
Cú pháp như sau:
<input size="size_num">
Ở trên, size_num là chiều rộng của ô nhập liệu bạn cần đặt bằng số. Giá trị mặc định là 20.
Ví dụ
<!DOCTYPE html> <html> <body> <h2>Đăng ký</h2> <form action="" method="get"> ID − <input type="text" name="id" placeholder="Nhập UserId tại đây..." size = "25" required><br> Mật khẩu − <input type="password" name="pwd" placeholder="Nhập mật khẩu tại đây..." required><br> Ngày sinh − <input type="date" name="dob" placeholder="Nhập ngày sinh tại đây..."><br> Điện thoại − <input type="tel" name="tel" placeholder="Nhập số di động tại đây..." required><br> Email − <input type="email" name="email" placeholder="Nhập email tại đây..." size = "35"><br><br> <button type="submit" value="Submit">Gửi</button> </form> </body> </html>
Kết quả
Trong ví dụ trên, chúng ta có một số trường với nút bấm:
<form action="" method="get"> ID − <input type="text" name="id" placeholder="Nhập UserId tại đây..." size = "25" required><br> Mật khẩu − <input type="password" name="pwd" placeholder="Nhập mật khẩu tại đây..." required><br> Ngày sinh − <input type="date" name="dob" placeholder="Nhập ngày sinh tại đây..."><br> Điện thoại − <input type="tel" name="tel" placeholder="Nhập số di động tại đây..." required><br> Email − <input type="email" name="email" placeholder="Nhập email tại đây..." size = "35"><br><br> <button type="submit" value="Submit">Gửi</button> </form>
Bây giờ, giả sử chúng ta muốn một hộp văn bản lớn hơn, tức là chiều rộng lớn hơn. Để làm vậy, chúng ta dùng thuộc tính size để đặt chiều rộng bằng số:
<input type="text" name="id" placeholder="Nhập UserId tại đây..." size = "25" required>