One, html tag attributes
- The label consists of three parts: label name, label attribute, and text content (a single label has no text content).
- Tag attributes are a way of describing tags.
- Tag attributes are divided into general attributes, own attributes and custom attributes.
- Common attributes: attributes that all tags have.
General attributes:
id: Give the label a unique name. The id name must be unique in the web page.
class: Give the label a class name.
style: used to set the style of the label, inline style.
title: The prompt content displayed when the mouse moves to the label.
- Custom attributes: usually used to pass values or for lazy loading of images.
Format: data-*
Two, form label
An important label for front-end interaction.
1. Common attributes:
name: the name of the form
action: The place where the form data is submitted (usually a back-end file name or URL). If it is #, it means submit to the current file.
method: The method for the front-end to submit data to the back-end. There are mainly get and post, the default is get.
2. Form elements:
Input category: Mainly used to input, select or issue instructions.
textarea class
select class
button class
3、input
type:
- text: Single-line text input box, optional, default value.
Attributes: placeholder (prompt), name (name), minlength/maxlength (minimum/maximum number of characters entered), disabled (invalid), readonly (read-only), value (default), pattern (regular matching)
- password: Password box, the attributes are the same as text.
- radio: radio button, usually more than two items. Common attributes: name (required), value, checked (selected by default), disabled (invalid), readonly (read only)
- checkbox: checkbox, can be used to select 0, 1, or multiple items. Common attributes: name (required), value, checked (selected by default), disabled (invalid), readonly (read only)
- file: File upload button.
- button: Normal button, usually used to call script code. Common attributes: value (the title of the button), disabled (invalid)
- image: Image button, usage is the same as button. Special attribute: src (load prompt picture). There is a submit function, the same as submit.
- submit: Submit button, used to submit form data to the background.
- reset: Reset button, clear all input content of the form and restore to the initial state.