Home > Article > Web Front-end > Let's talk about the difference between html and HTML5
Someone asked me today, do you often use html5 or html? emmm... Actually, when I usually write web pages, I don't make any special distinction between the two. If I have to talk about the differences, the obvious differences are the ones I list below. As for a deeper understanding: HTML5 has gone far beyond the scope of markup language. Behind it is a set of technologies. Xiaobai's study is too shallow and he dare not talk much. >.<
1. The document type declaration is different
html:
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
html5: Document declaration is relatively simple and conducive to Programmers read and develop quickly.
2. In terms of semantic structure
html: There is no structural semantic tag (in lay terms, it is inconvenient to read and does not tell you where to go) Where is the head, where is the tail)
html5: Added many semantic tags,
makes the code structure clear and improves the readability of the code.
The following are some semantic tags in HTML5:
< title>: short, descriptive, and unique (improves search engine ranking)
is also suitable for marking a set of introductory or navigational content within the page.
: Mark navigation, only used for important link groups in the document.
: The main content of the page, which can only be used once on a page. If it is a web application, surround its main functions.
: Represents a document, page, application or an independent container.
: A group with similar themes Content, such as a website's homepage, can be divided into sections for introduction, news items, contact information, and more.
: Specify the sidebar column, including quotes, sidebars, a set of links to articles, advertisements, friendly links, related product lists, etc.
: Footer, only when the parent is body, is the footer of the entire page.
: Specify the details and enter disclaimer, annotation, signature, and copyright.
is only suitable for short phrases and should not be used to mark long legal statements such as "Terms of Use" and "Privacy Policy".
: Indicates the importance of the content.
: Mark the key points of the content (largely used to improve the semantics of paragraph text).
: Highlight text (yellow) to remind readers.
In HTML5 em is the only element that represents emphasis, while strong represents importance.
: A block of text that reminds the reader for practical purposes and does not convey any additional importance
: Different Text for other texts = =|||This translation is really...
: Create a figure (the default is about 40px margin).
: Specify a citation or reference, such as the title of a book, the name of a song, movie, etc., a concert, concert, specification, newspaper, or legal document, etc.
is used only to refer to the source itself, not to quote from it.
: short quotes (cross-browser issues, try to avoid using them).
You can use the cite attribute (not the cite element!) on blockquoto and q elements, which is useful for search engine automation tools. cite=“URL” cites the source address.
: mark the time. The datetime attribute follows a specific format. If this attribute is omitted, the text content must be in a legal date or time format. Times that are no longer relevant are tagged with s.
: Explain abbreviations. Use the title attribute to provide the full name, which is OK if used only on the first occurrence.
abbr[title]{ border-bottom:1px dotted #000; }
: Definition term element, which must be next to the definition, can be in Used in the description list dl element.
: Contact information (email address, link to contact page) for the author, person or organization.If you provide the author contact information for the entire page, it is usually placed in the page-level footer. It cannot contain documents or other content such as documents.
: Removed content.
: Added content.
A rare element that can surround both block level and phrase content.
: Mark code. Contains sample code or file names (< > )
3.html5 drawing function
1) canvas
Before HTML5, web front-end developers could not draw in HTML Dynamically draw pictures on the page 1) HTM5 adds a new
• Step 1: Get the
• Step 2: Call the getContext() method of the Canvas object to get the CanvasRederingContext2D object (pass a parameter in the getContext method : "2d")
• Step 3: Call CanvasRederingContext2D to complete the drawing
2) SVG:Scalable vector graphics, used to define vector-based graphics for the network.
Thank you everyone for reading, I hope you will benefit a lot.
This article is reproduced from: https://blog.csdn.net/yezi__6/article/details/82881729
Recommended tutorial: "HTML Tutorial"
The above is the detailed content of Let's talk about the difference between html and HTML5. For more information, please follow other related articles on the PHP Chinese website!