First to sort out what the directory structure of the article
Now I will explain the properties and the role of head tag and its six sub-labels, please read patiently, there will be a great harvest Oh!
A, head tag
Optional attributes:
Attributes | value | description |
---|---|---|
profile | URL | A space-delimited list of URL, the URL contains metadata information about the page. |
Description:
·文档的头部经常会包含一些 meta 标签,用来告诉浏览器关于文档的附加信息。在将来,创作者可能会利用预先定义好的标准文档的元数据配置文件(metadata profile),以便更好地描述它们的文档。profile 属性提供了与当前文档相关联的配置文件的 URL。
·配置文件的格式以及浏览器使用它们的方式都还没有进行定义,这个属性主要是为将来的开发而保留的占位符。
Two, title tags
Optional attributes
Attributes | value | description |
---|---|---|
to you |
|
Provisions direction of the text element content. |
only | language_code | It defines the language of the code element content. |
xml: lang | language_code | It defines the language of the code XHTML document element content. |
Description:
·用于定义浏览器工具栏的标题
·用于提供页面被添加到收藏夹时显示的标题
·用于显示在搜索引擎结果中的页面标题
·title 标签是 head 标签中唯一要求包含的东西。
Three, Base label
The default address label prescribed for all links on a page or a default target
Required attributes:
Attributes | value | description |
---|---|---|
href |
URL | All the provisions relative links page reference URL. |
Optional attributes:
Attributes | value | description |
---|---|---|
target |
|
Open the page where all the links. |
Description:
·base标签只能在head标签中使用;
·base标签全局地址(href指定的地址)是针对相对链接的a、img、link、form 标签起作用;
·base标签全局属性(target属性)是针对所有没有设置该属性(target属性)的a标签起作用;
·base标签全局地址(href指定的地址)也可以是相对地址;
·在 HTML 中,base 标签没有结束标签;在 XHTML 中,base 标签必须被正确地关闭。
Four, Link Label
Definition document relationships with external resources, the most common use is linked style sheet.
Required attributes:
Attributes | value | description |
---|---|---|
href |
URL | The provisions of the linked document location |
Optional attributes:
Attributes | value | description |
---|---|---|
href |
URL | Specified positions that are linked document. |
hreflang |
language_code | Chinese language provision was linked document this is. |
media |
media_query | Provision was linked documents will be displayed on any device. |
rel |
|
The relationship between the provisions of the current document and the linked document. |
sizes |
|
The provisions of the size of the link resources. Only for rel = "icon". |
type |
MIME_type | The provisions of the MIME type of the linked document. |
Description:
·该标签只能存在于 head 部分,不过它可出现任何次数。
·在 HTML 中,<link> 标签没有结束标签
Five, style label
The label is used as an HTML document defines style information.
Required attributes:
Attributes | value | description |
---|---|---|
type |
text/css | MIME type specified style sheet. |
Optional attributes:
Attributes | value | description |
---|---|---|
media |
|
Different media types specified for the style sheet. |
六、meta标签
该标签http-equiv属性和name属性还有很多有用且好玩的值,持续关注我,后面将出这两个属性更多的值详解。
必选属性:
属性 | 值 | 描述 |
---|---|---|
content |
some_text | 定义与 http-equiv 或 name 属性相关的元信息 |
必选属性:
属性 | 值 | 描述 |
---|---|---|
http-equiv |
|
把 content 属性关联到 HTTP 头部。 |
name |
|
把 content 属性关联到一个名称。 |
scheme |
some_text | 定义用于翻译 content 属性值的格式。 |
说明:
http-equiv属性:相当于http的头部,它向浏览器传回一些信息 ,用来帮助正确的显示网页内容。
1、content-type(显示字符集的设定)
说明:设定页面使用的字符集。
用法:
<meta http-equiv="content-Type" content="text/html; charset=gb2312">
2、expires(期限)
说明:可以用于设定网页 到期时间,一旦网页到期,必须到服务器上重新传输。
实例:
<meta http-equiv="expires" content="Wed, 20 Jun 2007 22:33:00 GMT">
注意:必须使用gmt的时间格式
3、refresh(刷新)
说明:自动刷新并指向新的页面,常用于网站域名搬迁,搬迁后老域名会在一段时间内指向新域名,以减少流量的丢失。或者设置时隔多少刷新页面,设置刷新页面不用指定URL
实例
<meta http-equiv="Refresh" content="2;URL=http://www.uaoie.top/">
4、set-ookie(设定cookie)
说明:如果网页过期就删除cookie
实例:
<meta http-equiv="Set-Cookie" content="cookievalue=xxx;expires=Wednesday, 20-Jun-2007 22:33:00 GMT; path=/">
注意:必须使用gmt的时间格式
name属性:用来帮助别人阅读源文档的一些信息,也可以用来优化搜索引擎对文档的分类
1、author
说明:用来表示改文档的作者
2、description
说明:用来描述该文档
3、keywords
说明:可以帮助搜索引擎对文档进行分类
实例:
<meta name="keywords" content="HTML,ASP,PHP,SQL">
4、generator
Description: This editing software code
examples:
<Meta name="Generator" Content="PCDATA|FrontPage|">
5、revised
Description: The latest version of the custom page
examples:
<meta name="revised" content="bu, 2016/5/10/" />
scheme attribute: Specifies the program to be used for translation attribute value. This scheme should be defined in the profile attribute specified by the head tag profile file.
Seven, script tag
Tag defines a client-side script, such as JavaScript.
Required attributes
Attributes | value | description |
---|---|---|
type |
MIME-type (in general is "text / javascript") | Indicates the MIME type of the script. |
Optional attributes
Attributes | value | description |
---|---|---|
async |
async | Provisions asynchronous execution script (only for external scripts, that is, when using the src). |
charset |
charset | The provisions of character encoding used in an external script file. |
defer |
defer | Whether the provisions of the script execution delayed until the page loads up. |
src |
URL | URL specified external script file. |
xml:space | preserve | Whether the provisions of the code in the blank reserved. |
Description:
1、async
·如果 async="async":脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)
·如果不使用 async 且 defer="defer":脚本将在页面完成解析时执行
·如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本
2、charset
·charset 属性规定在外部脚本文件中使用的字符编码。
·如果外部文件中的字符编码与主文件中的编码方式不同,就要用到 charset 属性。
·默认的字符编码是 ISO-8859-1。
Character Set Reference Manual
3、defer
·defer 属性规定是否对脚本执行进行延迟,直到页面加载为止。
·有的 javascript 脚本 document.write 方法来创建当前的文档内容,其他脚本就不一定是了。
·如果您的脚本不会改变文档的内容,可将 defer 属性加入到 script 标签中,以便加快处理文档的速度。因为浏览器知道它将能够安全地读取文档的剩余部分而不用执行脚本,它将推迟对脚本的解释,直到文档已经显示给用户为止。
·只有 Internet Explorer 支持 defer 属性。
4、src
·src 属性规定外部脚本文件的 URL。
·有时,我们需要在网站的多个页面中运行 JavaScript。不需要重复编写相同的脚本,只需在单独的文件中创建 JavaScript,并以 .js 为后缀保存,然后使用 script 标签中的 src 属性引用该文件即可。
·外部文件不能包含 script 标签!
Eight eggs
<!DOCTYPE>
·<!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 html 标签之前。
·<!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
·在 HTML 4.01 中,<!DOCTYPE> 声明引用 DTD,因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则,这样浏览器才能正确地呈现内容。
·HTML5 不基于 SGML,所以不需要引用 DTD。
·在 HTML 4.01 中有三种 <!DOCTYPE> 声明。在 HTML5 中只有一种
·<!DOCTYPE> 声明对大小写不敏感。
·<!DOCTYPE> 声明没有结束标签。
SGML is a mark in the invention existed long before the Web to describe the common language documentation. But SGML is very large and difficult to learn and use. In view of this, it is proposed HTML language. But in recent years, with the deepening of Web applications, HTML has become stretched in a wide range of application needs, it was suggested that direct use of SGML as a Web language. But SGML is too large, and very difficult to learn to say nothing of a dilemma, that is, the full realization of SGML browser. So W3C Web Standards Organization recommended the use of a streamlined version of SGML --XML. XML and SGML, is a meta-language used to define other languages. Compared with SGML, XML specification of less than 1/10 of SGML specification, easy to understand, is a set of labels neither grammar nor a new generation markup language.
html 5
<!DOCTYPE html>