The content of this article:
- Common standard Properties
- P
- Div
- Span
- H Series
- Input
- Label
- Form
- Table
- TextArea
- Select
- A
- Img
- Ul
- Ol
- NewLine, horizontal line labels
- Common standard Event Properties
PS:HTML5 adds several more tags to the fire, which may be added later in the blog post.
Starting Date: 2018-04-01
Common standard Properties:
- Id:id is generally unique (not unique), because it is unique, so it is possible to identify a particular label. If you need to use a particular tag, you can define the ID
- Class: Is the name of the tag, unlike the ID, class can be repeated, generally used to select "Some" tag with class selector to define CSS style
- Style: Define styles for labels
- Other..
P: Introduction:
- P tags are used to define paragraphs, which generally use a blank space to represent the end of a paragraph, and there will be a certain amount of spacing between different paragraphs.
- Effect:
Properties: P tags have no special attributes, the main properties used are common properties
Example:
<p> a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph text a large paragraph text a large paragraph text a large paragraph text a large paragraph of text A large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text
</p>
Add:
- Because it is a paragraph, it will be considered as a text, so even if the P tag is wrapped in multiple lines of text, we will ignore the line break.
Div: Introduction:
- Somewhat similar to the P tag, but without the property of the P tag's own interval, which is generally used as the definition of "chunk" (this chunk content is so)
Properties: div tags have no special attributes, the main properties used are common properties
Example:
<div> A large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph text a large paragraph of text a large paragraph of text A large paragraph of text a large piece of text a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text a large paragraph of text </div>
Span: Introduction:
- There is a div a bit similar, but this is an inline tag, and the defined chunk is just a piece of the line.
Properties: The span tag has no special attributes, and the primary properties are all common properties
Example:
<span> a paragraph of text </span><span> a text </span>
H Series:
Introduced:
- Used to define headings with a fixed text style for each title
- H1 used to define a first-level title
- H2 used to define level two headings
- H3 used to define level three headings
- H4 used to define level four headings
- H5 used to define level five headings
- H6 used to define level six headings
Example:
Input: Introduction:
- Input is an input box (text input box, selection box, date selection box, file selection box, etc.), and the Type property of input determines what input box
Type property:
- When type= ' text ', is a plain text input box;
- Example:
<input type= "Text" >
- Type= ' password ' is a password input box; If input has the Value property, it is the default value of the input box;
- Type= ' button ' is a button that is primarily responsible for local "pushbutton events"
- Type= ' Submit ' is a button to submit a form, which is responsible for submitting the form to the background, which can submit the contents of form form;
- Example:
<input type= "Submit" >
- Type= ' Radio ' is a single box "name of the same value that affects them cannot be checked, can only be selected", if you need to have prompt content, need to fill in after the label, value only represents the result that is submitted to the background after the selection
- Type= ' checkbox ' is a check box that needs to be filled in after the label if it needs to be prompted, and value simply represents the result that was submitted to the background after the selection
- Type= ' data ' is a date selection box,
- Example:
<input type= "Date"/>
- Type= ' file ' requires a enctype= ' multi ' attribute in the form to upload the file.
- Example:
<input type= "File"/>
- Other common properties for input:
- Value: Defines the values of the input box
- For text "," password ", is the default value that defines the input box
- For "button", "Reset", "submit", is the text that defines the display on the button
- For "checkbox", "Radio", "image"- defines the value associated with the input (for example, clicking an option in radio represents what value returned to the background)
- Name: Defines the names of the input tags, which can be used to indicate which input box is represented, which can help the background get the values in the specified input
- For a radio box, the name of multiple input boxes must be the same, or you cannot "radio"
- ReadOnly: Specifies that the input box is read-only and not writable
- Checked: Tick option to use with ' checkbox ' or ' Radio ', checked= ' checked ' for the specified option on the input box
Label: Introduction:
- A label is just a static text that is typically used to label the input box.
Property:
Form: Introduction:
- Define the form, and all data transferred to the background is defined in the form
Property:
- Method: Defines the form in which data is transferred to the background
- Action: Defines the direction in which data is transferred
- Target: Define how to open a Web page after you open the submission form
- Enctype: Specifies how the form data should be encoded " enctype=" Multipart/form-data"when transferring files before sending to the server"
Example:
<form src= "login.html" method= "POST" > <label for= "T2" > User name:</label> <input id= "T2" type = "text"/> <label for= "T3" > Password:</label> <input id= "T3" type= "text"/> <input type = "Submit" value= "Submit Form"/></form>
Table: Introduction:
- Table is used to define the table
Sub-Tags:
- THEAD: Define "table Header"
- Define rows in Tr:thead
- Th:thead defined columns can actually be defined outside of THEAD, such as some vertical headers
- Tbody: Define "table Body"
- TD: Representative Column
- TR: Representative row
Property:
- Border: Set the width of the border
- RowSpan: Set the row span of a table
- Colspan: Setting column spans for a table
- Width: Sets the entire table's widths, but is not recommended, and should be styled by CSS
Add:
- If we do not define TBODY, the page will be added by default parsing, but will not add thead
- Table default is no border, you need to add
- For no content, and want to occupy a table space, you can use the
Example:
<table border= "2" width= ">" <thead> <tr> <th>id</th> <th> Name </th> <th> sex </th> </tr> </thead> <tbody> <tr> <td rowspan= "2" >8 class </td> <td> Xiao Ming </td> <td> men </td> </tr > <tr> <td> small 2</td> <td> men </td> </tr> </tbody ></table>
TEXTAREA: Introduction:
- is a multi-line text input box
Property:
- Rows: Specifies the visible width within the text area.
- COLS: Specifies the number of rows visible within the text area.
- Wrap: Set the line break mode for the input box
- ReadOnly: Specifies that multiline text boxes are read-only, non-writable
Example:
<textarea rows= "4" cols= "></textarea>"
Add:
- Default value: TextArea the default value to be defined as the content of the label
Select
Introduced:
Sub-Tags:
- Option: Define a drop-down menu
- Optgroup: Define drop-down menu group
Property:
- Size: Specifies the number of visible options in the drop-down list.
- Multiple: Whether to allow multiple selections
- Optgroup Label Property: The group name used to define the drop-down menu
- The properties of the option tag
- Value: Defines the values to be uploaded to the server after the selected option
- Selected: Defines whether the option is selected by default, "Selected=" Selected ""
Example:
<select name= "Cars" > <option value= "1" > Options 1</option> <option value= "2" > Options 2</ option> <option value= "3" > Options 3</option> </select> <select name= "Cars" size= "2" > <optgroup label= "file" > <option value= "1" selected= "selected" > Options 1</option> < Option value= "2" > Options 2</option> <option value= "3" > Options 3</option> </optgroup>< /select>
A: Introduction:
- A tag is used to define "anchor point", which can be used to "jump", jump to another page, or jump to another location on the source page.
Property:
- HREF: Defines the hyperlink, defines the "direction" of the jump, jumps to the specified address when the address is reached, and, as the ID, jumps to the location of the label of the specified ID of the original page, and when name is, jumps to the location of the a label of the specified name of the original page (all with # To do the prefix, there are examples below)
- Target: Defines how hyperlinks are opened, which are opened by default in this tab
- _blank: The delegate opens in a new window
Example:
<a href= "https://www.baidu.com" target= "_blank" > Jump to Baidu </a> <a href= "#a1" > Press me Down </a> <div > <a name= "A2" > large block of text </div> <br><br><br><br><br><br>& Lt;br><br><br><br><br><br> <br><br><br><br><br> <br><br><br><br><br><br><br> <br><br><br><br> <br><br><br><br><br><br><br><br> <br><br><br> <br><br><br><br><br><br><br><br><br> <br><br> <br><br><br><br><br><br><br><br><br><br> <br> <br><br><br><br><br><br><br><br><br><br><br> <div id= "A1" > Large paragraph text </div> <a href= "#a2" > Press me to go </a>
Add:
- There are also functional links, such as clicking on the call to the local mail software to send e-mail
IMG: Introduction:
- An IMG tag is used to insert a picture in a Web page
Property:
- SRC: Defines the source of the picture, can be a URL, can be a local address
- Alt: Define alternate text to display if no picture is present
- Border: Defines the border of a picture
Example:
(The following code implementation requires a picture)
UL: Introduction:
- Defines an unordered list.
Sub-Tags:
Properties: No commonly used properties or are not recommended.
Example:
<ul> <li>1</li> <li>2</li> <li>3</li> <li> A nested list <ul> <li>4.1.1</li> </ul> <ul> <li>4.3.1</li > </ul> </li></ul>
Add:
OL: Introduction:
Sub-Tags:
Property:
- Type: Define the order, A,a, i,i,1, etc order
Example:
<ol> <li>1</li> <li>2</li> <li>3</li> <ol> <li>4.1</li> <li>4.2</li> <li>4.3</li> </ol> <li>5</li></ol>
NewLine, horizontal line label:
- BR: Line break
- HR: Define a horizontal line
Common standard Event Properties:
- OnClick: Defines the tag-clicked event, which is a function that invokes the corresponding function by clicking on the tag.
- OnDblClick: Defines a double-click event for a label, and the value is a function that causes the corresponding function to be called when the label is double-clicked.
- Onfucus: Defines the label for the focus event, and the value is a function that causes the label to call the corresponding function when it receives the focus event.
- Onblur: Defines the label loses focus event, the value is a function that causes the label to lose focus event and call the corresponding function.
- Other....
<input type= "button" value= "button" onclick= "alert (555)" >
html-Common Tags
