You absolutely do not know the head tag


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
  • rtl
  • ltr
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

  • _blank
  • _parent
  • _self
  • _top
  • framename
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

  • alternate
  • author
  • help
  • icon
  • licence
  • next
  • pingback
  • prefetch
  • prev
  • search
  • sidebar
  • stylesheet
  • tag
The relationship between the provisions of the current document and the linked document.

sizes

  • heightxwidth
  • any
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

  • screen
  • tty
  • tv
  • projection
  • handheld
  • print
  • braille
  • aural
  • all
Different media types specified for the style sheet.

六、meta标签

该标签http-equiv属性和name属性还有很多有用且好玩的值,持续关注我,后面将出这两个属性更多的值详解。

必选属性:

属性 描述

content

some_text 定义与 http-equiv 或 name 属性相关的元信息

必选属性:

属性 描述

http-equiv

  • content-type
  • expires
  • refresh
  • set-cookie
把 content 属性关联到 HTTP 头部。

name

  • author
  • description
  • keywords
  • generator
  • revised
  • others
把 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>

Guess you like

Origin www.cnblogs.com/Juaoie/p/11443312.html