Front End Summary 3

New label

Header tag inside the page's head, the page logo and the main title can be placed in this tag.

Nav tags define page navigation area

<nav><li><a href= "#" > Navigation 1</a></li></nav>

Aside label Definition page Sidebar area

Section can define the content area of the Web page, article can define the main content of the article, forum content and so on.

The footer label defines the area at the bottom of the page.

The general head and navigation as well as the bottom label are the most commonly used. Other parts I was basically useless.

HTML5 's new video tags and audio tags are a major breakthrough in abandoning the traditional Flash plugin format, which is also simple to use.

　　

<video src= "Attachment/study1.mp4" width= "["] "Controls muted poster=" Images/logo.png "preload></video>

　　

The Controls property sets whether the control is displayed, muted specifies whether to mute, poster the address of the link is the image that is displayed when the video is downloaded, or the image that is displayed before the playback, preload specifies whether to load when the page is loaded, and this property cannot be used with AutoPlay. AutoPlay is required to start playback immediately after the video is ready, and the Loop property specifies whether to play repeatedly.

You can put different formats of video and audio in the source tag. You should always place several formats in case your browser doesn't support it.

The audio tag is basically the same as the vedio tag.

　　

Form

<form action= "" >        <input type= "search" name= "keywords" autocomplete= "on" autofocus>        <input Type= "Submit" value= "Submission" >    </form>

The AutoComplete property records historical input records so you don't have to work hard to add scripts. Similarly, another simple but used feature is the Autofocus property, which specifies that the focus is placed in the input box when the page is opened.

HTML5 another property that I find very useful is placeholder. This property can be more convenient than value, the Value property also clears the default value, and placeholder displays the default value when the input box is empty, and clears the default value when the input box is not empty.

There are also color types are very new tags, although in the mainstream browser support is not very good, but still a big breakthrough.

Range Type:

<input type= "range" min= "0" max= "ten" >

Min can set the minimum value, max sets the maximum value.

The multiple property can be used in a select tag or file tag to select multiple options.

TextArea

<textarea rows= "Ten" cols= "></textarea>"

Note: The Rows property is set not by pixels, but by the number of characters. The same is true of cols.

The Required property specifies the required input box.

　　

　　

<label for= "Unkown" > Unknown </label>        <input type= "Radio" name= "Gender" id= "unkown" value= "0" checked/ >

The label label and the input label are associated with the input tag through the For property, and the ID in the input tag is the same as the for property in the label label.

　　

<form action= "" method= "Get|post" ></form>

By setting Metho to get, parameters can be routed above the URL address to the server. Set as post to transfer parameters to the server in the background. This depends on whether you want to keep the contents of the input box confidential, and if it is an input box such as a password, it is usually post.

Framework:

<iframe src= "http://www.baidu.com" width= 100% "height=" frameborder= "0" scrolling= "yes" ></iframe>

You can add a Web page URL to the IFRAME tab and set the width height. The Frameborder property specifies the width of the border, usually defined in CSS, and the scrolling property specifies whether there are scroll bars, which are generally defined in JS.

　　

Front End Summary 3