Summary of basic tutorials for HTML5 and CSS3

1. HTML and CSS are the foundation of the World Wide Web (WWW).

2. WWW: World Wide Web, one of the services offered by the Internet. Divided into Web clients and Web server programs. Based on HTTP (Hypertext Transfer Protocol) and HTML. is identified by a global URI (Uniform Resource Identifier). The resource is transmitted to the user via the Hypertext Transfer Protocol.

3. World Wide Web Consortium:

4.https more than HTTP a secret function, Consortium.

5. The composition of the label: element, attribute (attribute), and value.

6. Most elements contain both text and other elements. Some elements consist of a start tag, a content, and an end tag. An empty element contains neither text nor other elements. Empty elements have only one label

The BODY element covers the contents of the page, including text, images, forms, audio, video, and other interactive content, which is what visitors see.

7. When the browser renders HTML, it compresses multiple spaces or tabs in the text into a single space, converts the carriage return and newline characters into a single space, or ignores them together.

8. Special characters: Copyright symbol: &copy, small e:&eacute,<:&lt;,>:&gt; with intonation Please see http://www.elizabethcastro.com/html/extras/entities.html for details.

9.URL (Uniform Resource Locator) Uniform Resource Locator. The first part becomes the pattern. The mode has HTTP and FTP (file Transfer Protocol) files Transfer protocol and so on. The second part is the name of the host where the file resides. Part Three path

Mode of HTTP

Mode hostname Path

" http :// www.site.com / tofu/index.html "

Mode of FTP

Mode hostname Path

" FTP ://Ftp.site.com/pub/index.pdf"

URLs for e-mail addresses include mailto mode

Mode e-mail address

" mailto : [email protected] "

10. Italic <em> denotes the meaning </em> or font:italic of emphasis;

<address> is also italic, it is forbidden to add H1~h6, article, address, aside, footer, header, Hgroup, nav, section

<small> becomes smaller, the meaning of which is the rule of law and other stripes. Put it in the footer, all rights reserved.

<strong> Bold, text that you want to mark as important content

<figure> steps to create a diagram and its title

<cite> marks the title of music albums, movies, books, and artwork, and is also italic

Two special elements are used to mark the quoted text. The blockquote element represents a single quote that exists. The Q element is used for short quotes

<time datetime= "" > Mark Time

<abbr title= "" > Mark abbreviations and use title to explain their meanings, style tags containing the title of the Abbr:abbr[title] {}

<dfn> is used for terminology, and the subsequent use of terminology does not need to be defined. Italic

<sub> Create subscript <span>H₂O</span>

<sup> Create superscript <span>X²</span>

<del> tag deletion, same as text-decoration: line-through; elements that surround the phrase content and can surround the block level content

<ins> underline, with text-decoration: underline; elements that surround phrase content and can surround block-level content

<code> indicates that the text is either a code or a file name

<pre> pre-formatted text, preserving the text's inherent line breaks and spaces. It automatically turns off line wrapping there will be a scroll bar with a wide content, plus a word-space:pre-wrap;

<mark> highlighter style, typically a yellow background

<ruby><rp><rt> Side note Markers <ruby> North <rp> (</rp> <rt>bei</rt> <rp> ) </rp> <rp> (</rp> <rt>jing</rt> <rp>) </rp> </ruby> = Beijing Have Beijing

<meter> the percentage of bars <meter value= "0.8" >80%</meter>

<progress> calculated percentage of the bar <progress value= "Notoginseng" max= "" ">

When the picture is not loaded, displays the contents of Alt

HTML5 introduces header, footer, Main, article, section, aside (links to other websites), Nav.

12. Landmark role

Landmark role	How to use
role= "banner" (banner) page top, website logo, website sponsor logo, full site search tool	Header elements placed at the page level, each page is used only once
role= "Navigation" (navigation) is usually a link	Corresponds to NAV, where each page can be used multiple times but not over-utilized
role= main contents of the "main" (main) document	As with main, it is best to add it to the main element, or to other elements, each page will be used only once
Role= the supporting part of the "complementary" (Supplemental content) document as the main content supplement. It is meaningful to differentiate the subject content.	And aside is the correspondence relationship. It should be added to the aside or DIV element. Each page can be used multiple times but not excessively
Role= "ContentInfo" (content information) contains an example of a large, perceptible area of information about a document such as a copyright notice and a link to a privacy statement	Can be added to the entire page footer (usually footer), each page is used only once

13. Link to two main sections: goals and tags. Target specifies what happens when a visitor clicks a link, a tag that a visitor sees in a browser or a test section in a screen reader, which can be text, an image, or both.

Summary of basic tutorials for HTML5 and CSS3