Home > Developer > JavaScript
The development of HTML5 has been broadly summed up before.
Here is a previous essay: Http://www.cnblogs.com/jiangxiaobo/p/5199924.html
We will summarize from the basis of HTML5. Hope can improve the basis of their own.
HTML5 is not a revolutionary development, it is the inheritance and development of previous versions of HTML, so HTML5 retains most of the previous HTML versions of the tags.
1. Basic elements
There are several basic elements of HTML5 retention.
1 <!--...--> define HTML annotations. The content that is located between <!--and is treated as a comment.
2
3
4 <title> It is used to define the page title of the HTML5 document.
5 <body> It is used to define the page body portion of the HTML5 document, which can specify core properties such as ID, class, style, and can also specify OnLoad, OnUnload, onclick, ondblclick, OnMouseDown, OnMouseUp, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup and other event attributes, These properties are used to specify JavaScript scripts.
6 <style> This element is used for the introduction of style definitions.
7
8 <p> Define a paragraph that can specify core attributes such as ID, class, style, and various event properties such as OnClick.
9 <br> Insert a newline that specifies the core properties such as ID, class, style, and so on.
10
11 <div> Define sections in the document. The tag can specify core properties such as ID, class, style, and various event properties such as OnClick.
12 <span> is basically similar to <div>, except that the section of the definition does not wrap by default. The label can specify and <div> the same properties.
2. Text formatting elements
The following elements allow text content to render a specific effect in the browser.
1 "<b> define bold text. The tag can specify core properties such as ID, class, style, and various event properties such as OnClick.
2 "<i> define italic text. The tag can specify core properties such as ID, class, style, and various event properties such as OnClick.
3 <em> Definition Emphasis text, the actual effect is similar to italic text. The tag can specify core properties such as ID, class, style, and various event properties such as OnClick.
4 "<strong> define bold text. The function and usage of the <b> tag are basically the same.
5 <small> Define the text of the small font. The tag can specify core properties such as ID, class, style, and various event properties such as OnClick.
6 "<sup> define superscript text. The tag can specify core properties such as ID, class, style, and various event properties such as OnClick.
7 "<sub> define subscript text. The tag can specify core properties such as ID, class, style, and various event properties such as OnClick.
8 <bdo> define the direction of the text display. The tag can specify core properties such as ID, class, style, and various event properties such as OnClick. In addition, the label can also specify the Dir property, which can only be ltr or RTL.
3. Semantic-related elements
HTML5 retains the following semantic-related elements.
1 <abbr> is used to denote an abbreviation. You can specify the following properties when using this element.
Title This property is used to specify the full name that the abbreviation represents.
2 <address> to represent an address. Browsers typically display <address.../> text in italics.
3 <blockquote> defines a long reference text. The browser displays the referenced text in an indented manner. The following properties can be specified when using the <blockquote.../> element.
Cite this property specifies the URL URLs that the reference text refers to
4 <q> defines a short reference text. The browser adds quotation marks to the quoted text.
5 <cite> used to denote the title of a work (a book, a movie, a song). Often browsers display <cite.../> text in italics.
6 <code> used to represent a piece of computer code.
7 <dfn> for defining a professional term. Browsers typically display <dfn.../> text in bold or italic characters.
8 <del> defines the text that is deleted in the document. The browser typically displays <del> contained text in a line-in-picture format.
9 <ins> defines the text inserted in the text. The browser typically displays <ins> contained text in the following lines.
<del>, <ins> Two elements can specify the following two properties:
Cite the property value is a URL, and the text that corresponds to the URL explains why the text was deleted or inserted.
DateTime defines the date and time that the text was deleted or inserted.
10 <pre> to indicate that the element contains text that has been "pre-formatted". In other words, spaces, carriage returns, tab keys, and other formatting characters in the text contained in the,<pre.../> element are preserved, but the browser handles most of the HTML elements in the <pre.../> element.
11 <samp> used to define the model text content.
12 <kbd> for defining keyboard text. This element is used to indicate that text is entered through the keyboard. Usually the text is used on the computer, which is often used in the instructions.
13 <var> used to represent a variable. Browsers usually display <var in italics ... The text contained in the/>.
4. Hyperlinks and Anchor points
HTML pages use hyperlinks to save the association with another resource on the network, and when the user clicks a hyperlink on the page, the browser navigates to the resource referred to by the hyperlink.
HTML5 retains the <a.../> element that defines the hyperlink, which can specify core properties such as ID, class, style, or various event properties such as OnClick. It can also specify the following three important properties.
HREF Specifies the other resource that the hyperlink is associated with.
Target specifies which frame in the frameset is used to load another resource. The attribute value of this property can be _self, _blank, _top, _parent four values, representing the use of itself, a new window, a top-level frame, a parent frame to load a new resource.
Media Specifies the medium type that the destination URL refers to. The default value is all. This property is valid only if the HREF attribute is specified.
<a.../> elements can include text, images, various text formatting elements, and table cells.
The full URL follows the syntax rules:
Scheme://host.domain:port/path/filename
The explanation for this URL address is as follows:
Scheme specifies the type of Internet service. The most popular type is HTTP.
domain specifies the Internet name.
Host Specifies the hosts for this domain name. If omitted, the default host for HTTP is www.
PORT Specifies the port number of the host. The port number can usually be omitted, and the default port for the HTTP service is 80.
path Specifies the paths on the remote server, which can also be omitted, and the path is omitted by default to the root of the Web site.
filename Specifies the name of the remote document. If you omit the file name, you will typically locate files such as index.html, index.htm, or other files that are set by the Web server.
Draw a Watch:
URL popular scheme and corresponding resources
| Scheme | corresponding resources |
| File | Accessing files on a local disk |
| Ftp | Accessing files on a remote FTP server |
| http | accessing files on the WWW server |
| News | Access a file on a newsgroup |
| Telnet | Access Telnet link |
| Gopher | Accessing files on a remote gopher server |
In addition to this, the,<a.../> element generates a named anchor point, which is used to generate an anchor point in an HTML page, allowing the hyperlink to be linked directly to that anchor point of the specified page.
Inserting an anchor point requires specifying the Name property, which is the value of the anchor point. For example, the following code:
<!--the code below generates a named anchor--
<a name= "Test" ></a>
When a browser browses a named anchor Point, the named anchor does not produce any display, and we can use the following hyperlink to navigate to the anchor point:
<a href= "Anchor.html#test" > Navigate to test Anchor </a>
5. List-related elements
HTML5 also retains the following list-related elements.
1 <ul> define unordered list. This element can specify attributes such as ID, class, style, etc., and can also specify event properties such as OnClick. This element can contain only <li ... /> the child element.
2 <ol> defines a list of sequences. This element can specify attributes such as ID, class, style, etc., and can also specify event properties such as OnClick. This element can contain only <li ... /> the child element. In addition, in the HTML5 specification, the element can also specify the following three properties.
Start specifies the starting number of the list item. The default is the first one, such as 1, a, and so on.
type specifies which type of number to use, for example 1 for using numbers, a and a for letters, I and I for using Roman numerals. This property is deprecated in the HTML5 specification and is recommended for use with CSS.
Reversed this property specifies whether to reverse the sort. Unfortunately, no browsers currently support this property.
3 <li> define list items. This element can specify attributes such as ID, class, style, etc., and can also specify event properties such as OnClick. The element can be contained with <div ... /> completely similar content, so you can include more types of child elements.
4 <dl> is also used to define the list, which can only contain <dt.../> and <dd ... /> Two seed element. This element can specify attributes such as ID, style, class, and so on, and can also specify event properties such as OnClick.
5 <dt> Define the title list item. This element can specify attributes such as ID, style, class, and so on, and can also specify event properties such as OnClick. The element can contain only text, images, hyperlinks, text formatting elements, and form control elements.
6 <dd> define normal list items. This element can specify attributes such as ID, style, class, and so on, and can also specify event properties such as OnClick. The element can be contained with <div ... /> completely similar content, so you can include more types of child elements.
6. Image-related elements
HTML5 retains the element to define the image on the page, which can only be an empty element and it cannot contain any content. This element can specify attributes such as ID, style, class, and so on, and can also specify event properties such as OnClick. Not only that, the following two attributes must be specified for the element to be used.
SRC This property specifies the location of the picture file, which can be either a relative path or an absolute path.
Alt This property specifies a piece of text that will be used as a hint for the picture.
In addition, the element can specify the following two optional attributes.
Height specifies how high the picture should be, either as a percentage or as a pixel value.
width Specifies how wide the picture can be, either as a percentage or as a pixel value.
In addition, there are two tags associated with the image.
<map> for defining picture mappings. The element can contain one or more <area.../> child elements, each of the <area.../> child elements defines an area, and different areas can be linked to different URLs.
<area> the internal area used to define the image map. The element can only be an empty element that specifies attributes such as ID, style, class, and other event properties such as OnClick, as well as onfocus, onblur, and other focus-related properties. In addition to this, you can specify several properties.
SHAPE specifies which area of the inner area is, the default value of which is "rect", which is the rectangular area, and in addition to circle and ploy, which represent the circle area and the polygon area.
COORDS specifies multiple coordinate values that determine the location of the zone.
The href is used to determine the resource that the zone is linked to.
Alt This property specifies a piece of text that will be used as the picture tip information.
Target specifies which frame in the frameset is used to load another resource. The attribute value of this property can be _self, _blank, _top, _parent four values, representing the use of itself, a new window, a top-level frame, a parent frame to load a new resource.
Media Specifies the medium type that the destination URL refers to. The default value is all. This property is valid only if the HREF attribute is specified.
Once we have defined the image map using the <map.../> element, we can let the specified picture use the picture map, let the picture map using the Usemap property for the element, set the Usemap property value to # Mapname can be.
<!--define picture mapping--
<map name= "test" id= "Test" >
<!--define 2 regions for the picture map--
<area shape= "Circle" coords= "57,55,25" href= "http://www.baidu.com" alt= "Baidu a Bit"/>
<area shape= "Poly" coords= "188,28,185,50,200,74,224,72,246,51" href= "http://www.baidu.com" alt= "Baidu a Bit"/>
</map>
Html5-css3-javascript (1)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
