HTML5 input tag, details label, Mark Tag, and progress bar label usage

recently in self-study HTML5 related knowledge, for the first time to write a blog, this time the main record input tag and DataList tag combination, details label, mark Tag and progress bar label use.

I. Use of input tags and detail tags

1. Basic grammar

<inputtype= "text"List= "Vallist"/>   <DataListID= "Vallist">      <optionvalue= "C + +">C++</option>      <optionvalue= "C #">C#</option>      <optionvalue= "Java">Java</option>   </DataList>

2. Effects

It is important to note that the List property value in input must be consistent with the ID of DataList

Ii. details of the label

1. Basic syntax

< Details >   < Summary > English </summary>   <p> Global language </p></details>

2. Effect:

It is important to note that the Details tab's Open property allows the content to be displayed directly

<open= "Open">   <> English < /Summary>   <p> Global Language </ P > </ Details >

Effect

Third, Mark label

1. Basic syntax:

< Mark > Mark </mark>

2. Effects

The mark label is easy to use and makes the text look bright.

Four, progress bar label Progress

1. Basic syntax:

<max= " +" value= "/> "

2. Effect:

It is important to note that Max refers to the maximum value of the progress bar, and value refers to the current progress value.

HTML5 input tag, details label, Mark Tag, and progress bar label usage