HTML5 Study Notes (1): HTML5 Introduction and grammar

Source: Internet
Author: User
Tags silverlight

HTML5 Introduction

HTML5 is the next-generation HTML standard specification following HTML4, which provides some new elements and attributes (such as <nav> site navigation blocks and <footer> ). The new label facilitates search engine and semantic analysis, while helping small-screen devices and visually impaired users, in addition to providing some new features, such as video <video> and audio and <audio> , in summary, have the following major features:

    • Removed some obsolete element and attribute tags in the HTML4

These include purely display-effect markers, such as <font> and <center> , which have been superseded by CSS. HTML5 draws on some of the XHTML2 recommendations, including some features to improve the structure of the document, such as the use of new HTML tags,,, and header footer so on, that dialog aside figure will enable content creators to create documents more semantically, The previous developers are generally used when implementing these features div .

    • Separation of content and presentation

band i labels remain, but their meanings are different from before, and the meaning of these labels is simply to identify a piece of text, rather than to set them in bold or oblique style. , and the u font center strike labels are completely removed.

    • New additions to the form input object

Includes dates, url,email addresses, and other objects that add support for non-Latin characters. HTML5 also introduces micro-data, a method that uses machine-identifiable labels to label content, making semantic Web processing easier. In general, these structure-related improvements allow content creators to create cleaner, easier-to-manage Web pages that are more friendly to search engines and to read-screen software.

    • Brand new, more reasonable labels

Multimedia objects will no longer be all bound in object or embed tag, but the video has a video tag, audio has audio tag.

    • Local storage

This feature will embed a local SQL database to speed up interactive search, caching, and indexing capabilities. At the same time, those offline Web programs will also benefit. There is no need for rich animations for plugins.

    • Canvas Object

will give the browser the ability to draw vectors directly above, which means that users can move away from flash and Silverlight and display graphics or animations directly in the browser.

    • The new API extension

HTMLDocument HTMLElement provides a new API extension for and excuses.

    • HTML5 replace Flash and Silverlight
Syntax (Syntax) 1 Document Media type

Most of the HTML syntax defined by HTML5 is compatible with HTML4 and XHTML1, but it is also partially incompatible. Most HTML documents are saved as text/html media types.

HTML5 defines detailed parsing rules (including error handling) for HTML syntax, which the user must follow to save it as a text/html media type. Here is an example that conforms to the HTML syntax specification:

<!DOCTYPE HTML>
<Html>
<Head>
<MetaCharSet= "UTF-8">
<Title>example document</title>
</Head>
<body>
<p>example paragraph</P>
</Body>
</html>

HTML5 also defines a text/html-sandboxed media type for HTML syntax so that it can host untrusted content.

Other syntax that can be used in HTML5 is XML, which is compatible with XHTML1. With XML syntax, you need to save the document as an XML media type, and set the namespace (namespace) to http://www.w3.org/1999/xhtml according to the XML specification.

The following example document conforms to the XML syntax specification in HTML5, and it is important to note that the XML document must be stored as an XML media type, such as Application/xhtml+xml or Application/xml.

<?XML version= "1.0" encoding= "UTF-8"?>
<Htmlxmlns= "Http://www.w3.org/1999/xhtml">
<Head>
<Title>example document</title>
</Head>
<body>
<p>example paragraph</P>
</Body>
</html>

2 Character Encoding

In HTML5 's HTML syntax, there are three ways to declare the encoding type of a string:

    1. On the transport level (transport levels), set Content-type in the header of the HTTP instance.
    2. Set a Unicode byte Order Mark (BOM) at the beginning of the file, which provides a signature for the encoding way of the file.
    3. In the content before the first 1024 bytes of the document, use the META element with the CharSet attribute to declare the encoding mode. For example:<meta charset= "UTF-8" > indicates that the document is in UTF-8 format. It is replaced with the original <meta http-equiv= "Content-type" content= "text/html; charset=utf-8" > Syntax declaration, although the original syntax is still available, But it is not recommended in HTML5.

FOR XML syntax in HTML5, it is still the same as the previous XML syntax declaration.

3 DOCTYPE

HTML5 's HTML syntax requires the document to be declared DOCTYPE to ensure that the browser can present the page in standard mode. This DOCTYPE has no other purpose and is optional in XML because the XML Media Format document has been processed in standard mode.

DOCTYPE is declared by <! DOCTYPE Html>, case insensitive. The earlier version of HTML declares that the DOCTYPE takes a long time because the HTML language is based on SGML, so it is necessary to associate a reference to a DTD. HTML5 is not the same as the previous version, just need to declare DOCTYPE can tell the document is enabled by the HTML5 syntax standard, the browser will be <! DOCTYPE html> do the rest of the work.

4 MathML and SVG

HTML5 's HTML syntax allows the use of MathML (mathematical Markup Language) and SVG (scalable vector) elements in the document. For example, a very simple HTML page contains a circle drawn by an SVG element:

<!DOCTYPE HTML>
<Title>svg in text/html</Title>
<p>
A Green Circle:
<svg > <circle r= " Cx=" " Cy= " Fill=" green "/ > </svg>
</p>

More complex combinations of tags are also supported, such as using SVG's foreignobject elements you can nest MathML, HTML, or nested within yourself.

5 Other

HTML5 has natively supported IRI, although these IRI can only be used in UTF-8 and UTF-16 documents.

If the setting is not valid, it will be updated to an empty string to tell the browser that it is an unknown language, as it does with Xml:lang in XML .

HTML5 Study Notes (1): HTML5 Introduction and grammar

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.