2, the basic grammatical characteristics of HTML (1) HTML is not sensitive to the line, the tab is not sensitive
HTML only cares about the nested structure of tags, nested relationships. Who nested who, who was nested, and line-wrapping, tab-Independent. No line break, tab not tab, does not affect the structure of the page.
In other words, HTML does not rely on indentation to represent nesting, that is, to look at the label's parcel relationship. However, we find that there is good indentation and the code is easier to read. Ask everyone to indent the label correctly.(2) Blank folding phenomenon
All the text in the HTML, if there are spaces, line breaks, tab will be collapsed to a space display.(3) The label should be strictly closed seven, HTML structure detailed
Create a new HTML file, enter Html:5, and press the TAB key to automatically generate the following code:
<! DOCTYPE html>"en">" UTF-8"> <title>Document</title>1. Document Declaration Header
Any standard HTML page, the first line must be a
<! DOCTYPE ...
The beginning of this line is the document declaration header, DocType Declaration, referred to as DTD. This tag tells the browser which HTML or XHTML specification to use for the document.
Xhtml:extensible hypertext Markup Language, extensible Hypertext Markup Language.
The main purpose of XHTML is to replace HTML, or it can be understood as an upgraded version of HTML.
HTML tag writing is very irregular, causing other devices (ipad, mobile phone, TV, etc.) to not display properly.
XHTML is basically the same as HTML4.0 's markup.
XHTML is strict, pure HTML
The following content is only understood:What are the specifications of HTML4.01?
First we determine one thing, we are now learning HTML4.01 This version, this version is IE6 start compatible. HTML5 is compatible with IE9 start . But IE6, 7, 8 these browsers can not be prematurely eliminated, so these years the web should be used HTML4.01 to make. Today, mobile phones, mobile Web pages, you can use HTML5, because of its higher compatibility.
Aside from that, HTML1 to HTML3 is used by the U.S. military and advanced research institutes and is not publicly available.
There are two major kinds of norms in HTML4.01, each of which has 3 kinds of small specifications. So there are 6 different specifications (see below):
The HTML4.01 contains two general and XHTML specifications.
HTML feel that some of the rules are not rigorous, such as the label can be used in uppercase?
So, the HTML feel, put some standard strict standards, and set up a XHTML1.0. The letter X in XHTML, which means "strict".
Summing up, HTML4.01 altogether has 6 kinds of DTD, plainly speaking, the first line of HTML statement a total of 6 kinds:
The following three types of small specifications are explained:
strict: "Strict", this model is more stringent requirements. Where is this strictly manifested? Some tags are not available.
For example, the U tag is to underline a text, but this is in conflict with the nature of HTML, because HTML is responsible only for semantics, not for styles, and U is a style. Therefore, you cannot use the U-tag in strict.
How do you add an underscore to the text? Future CSS will be resolved using CSS properties.
XHTML1.0, then, is stricter because the system itself stipulates that the label must be lowercase, must be tightly closed, the attribute must be quoted, and so on.
transitional: "Ordinary", this pattern is not a few other specifications.
Frameset: Represents "frames", which are used on the frames page.
The html:xt,x indicated in the sublime input indicates that xhtml,t represents transitional.
The HTML5 greatly simplifies the DTD, which means that there is no XHTML in HTML5 (it is a face-up):
<! DOCTYPE html>
OK, here's the point.2. Head tag
The head tag is placed between the header parts. This includes:
2.1 Meta Tag Introduction:
<title>: Specifies the title of the entire page, displayed at the top of the browser.
<meta>: Provides basic information about the page
<link>: Defines the relationship between a document and an external resource.
- <style>: Defining the relationship between an internal style sheet and a Web page
The element can provide the original information about the page (mata-information), a description of the search engine and the frequency of updates, and keywords.
The label is located in the header of the document and does not contain any content.
The information provided is not visible to the user. Meta tag composition: Meta tags have two attributes, which are the Http-equiv property and the Name property, and different properties have different parameter values, these different parameter values to achieve a different page function.
Common META Tags:
(1) Http-equiv property
It is used to convey some useful information to the browser, to help the browser to correctly display the content of the Web page, and the corresponding property value of content,content content is actually the variable value of each parameter.
<!--redirect 2 seconds to the corresponding URL, note the semicolon--><meta http-equiv="refresh" content="2 ; url=http://www.luffycity.com"><!--Specify the content type and encoding type of the document--><meta http-equiv=" Content-type "content="text/html;charset=utf-8 "/><!-- Tell IE to render the current page in top-level mode--><meta http-equiv="x-ua-compatible " content= " ie=edge">
(2) Name property
Mainly used for page keywords and descriptions, is written to the search engine to see, the key word can have a number of ', ' separated, with the corresponding property value for content,content content is easy to search engine robots to find information and classification information.
<meta name="Keywords" content= " netease, email, games, news, sports, entertainment, women, Asian Games, forums, SMS " />
These keywords, is to tell the search engine, this page is why, can improve the search hit rate. Let others find you, search.
<meta name="Description" content= " NetEase is China's leading internet technology company, providing users with free mailbox, games, Search engine services, the creation of news, entertainment, sports and more than 30 content channels, and blogs, videos, forums and other interactive exchanges, the power of the network. " />
as long as the set description page description, then Baidu search results, you can display these statements, this technology is called SEO(search engine optimization, SEO).
The effect is as follows:
<meta name=viewport content="width=device-width, initial-scale=1">
The above tag is to let our web page support mobile, mobile device first (understand)2.2 Title tag is mainly used to tell the user and search engine the main content of this page, search engine can through the page title, quickly determine the current page theme.
<title> Luffy City </title>
The effect is as follows:
01-html Introduction and head tags