Input types of input elements in HTML

The article introduces input data types for input elements.

The article introduces input data types for elements in HTML.

Text data

define input data as a single-line text field.


  Tên: 
 
 
 
  Họ:

Password data

field definition fills the password.


  Tên người dùng: 
 
 
 
  Mật khẩu:

Note: The character in the password field will be masked (with a star or a dot)

Submit form

defines the button to send the form to the form-handler, usually the home page that has the script to handle the input data and is specified by the action. attribute action. If this attribute is omitted, the submit button will show the default text.


  Tên: 
 
 
 
  Họ:

Reset input data

Define the button to refresh all values in the form to the default value.


  Tên: 
 
 
 
  Họ:

Round button data

define a circle button to select only one answer in the given answer.


  Nam 
 
  Nữ 
 
  Khác

Checkbox data

Defines the checkbox, allowing users to not select or select multiple answers


  Tôi có xe đạp 
 
  Tôi có ô tô

. Button type data

button definition.

Input data of HTML5

HTML5 also added some other input data types (old browsers do not support them, they will work as ) including:

color
date
datetime-local
email
month
number
range
search
tel
time
URL
week

Input data color

used to fill the input field of the input data. Depending on the browser, the palette will appear.


  Chọn màu yêu thích của bạn:

Date data

Date field definition. Depending on the browser, the date selection tool will be displayed.


  Ngày sinh:

You can use min and max attributes to limit dates.


  Nhập ngày trước 1980-01-01: 
 
 
  Nhập ngày sau 2000-01-01:

Data as local time and date

define the date and time in the data field, not the time zone. Depending on the browser, the date and time selection tool will be displayed.


  Sinh nhật (ngày và giờ):

Email data

define input data as email address. Depending on whether the browser supports, the address is automatically verified. Some smartphones recognize email and add '.com' to the keyboard.


  E-mail:

Data is file

Define the file selection and the 'Browse' button to select the file and upload it.


  Chọn tập tin:

Month data

Allows users to select months and years. Depending on the supported browser, the date picker will appear.


  Sinh nhật (tháng và năm):

Digital data

Defining numerical data fields, can limit approved numbers. The following example shows the number input field, which takes values from 1 to 5.


  Số lượng (từ 1 tới 5):

Limit input data

Below is a list of some of the input limit attributes, marked with * as new HTML5 attributes.

Description property disabled disable max data field * maximum value of maxlength data field maximum number of min data fields * minimum value of pattern data field * first value check expression entering readonly specifies that the data field can only be read (cannot be changed) required * data field is required (must be filled) size width (in characters) of step * valid distance between fields value of the data field value the default value of the data field

The following example shows a numeric data field that can enter 0 to 100, values separated by 10 units, default value 30.


  Số lượng:

Data in a span

define when the correct value does not matter, such as using a slider. The default value is in the range of 0 to 100. You can choose a range by the min, max and step. attributes step.

Search field data

used to define search fields (like text input fields).


  Tìm kiếm trên Google:

Data as a phone number

used to enter phone numbers and supported on Safari 8.


  Số điện thoại:

Time data

used to select the time (not the time zone). If the browser supports it, the time picker will appear.


  Chọn thời gian:

URL data

used for data fields with URL addresses. Depending on whether the browser supports, the address will automatically be validated. Some smartphone devices identify the URL and add '.com' to the keyboard.