HTML 文档由 HTML 元素定义。
HTML 元素语法
HTML 元素以开始标签起始 HTML 元素以结束标签终止
元素的内容是开始标签与结束标签之间的内容
某些 HTML 元素具有空内容(empty content)
空元素在开始标签中进行关闭(以开始标签的结束而结束)
大多数 HTML 元素可拥有属性
属性是 HTML 元素提供的附加信息。
HTML 属性
HTML 元素可以设置属性
属性可以在元素中添加附加信息
属性一般描述于开始标签
属性总是以名称/值对的形式出现,比如:name="value"。
注释是一种特殊的标签,主要是帮助开发者理解代码的逻辑。不会在网页中显示,但是在源代码以及开发者工具中可以看到。很多编辑器中使用 Ctrl + / 组合键可以快速注释。
<!DOCTYPE html> 声明为 HTML5 文档
html:元素是html页面的根元素,所有html标签的一个根节点。
head:文档的头部,描述了文档的各种属性和信息,包括文档的标题,在web中的位置以及和其他文档的关系。
meta:使用 <meta> 元素来描述HTML文档的描述,关键词,作者,字符集等。
title:元素描述了文档的标题
body:元素包含了可见的页面内容,文档的主体,以后我们的页面内容基本上都是写到这个标签里面的(比如文本、超链接、图像、表格和列表)。
<!DOCTYPE html>
<!--html是html文档的根元素-->
<html >
<!--head定义文档标题等属性,用户不可见-->
<head>
<meta charset="UTF-8">
<!--title设置网页的标题-->
<title>我的第一个网页</title>
</head>
<!--body显示给用户的内容-->
<body>
Hello world, 我是一个男孩!
</body>
</html>
阅读原文
例
简单的 HTML5 文档:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文档标题</title>
</head>
<body>
文档内容......
</body>
</html>
浏览器支持
所有主流浏览器都支持 <html> 标签。
标签定义及使用说明
<html> 标签告知浏览器这是一个 HTML 文档。
<html> 标签是 HTML 文档中最外层的元素。
<html> 标签是所有其他 HTML 元素(除了 <!DOCTYPE> 标签)的容器。
HTML 4.01 与 HTML5之间的差异
HTML5 中,增加了一个新属性:manifest。
HTML 与 XHTML 之间的差异
xmlns 属性在 XHTML 中是必需的,但在 HTML中不是。
然而,即使 XHTML 文档中的 <html> 没有使用 xmlns 属性,W3C 上的 HTML 验证器也不会报错。这是因为 "xmlns=http://www.w3.org/1999/xhtml" 是一个固定值,即使您没有包含它,此值也会被添加到 <html> 标签中。
属性
New :HTML5 中的新属性。
| 属性 | 值 | 描述 |
|---|---|---|
| manifestNew | URL | 定义一个 URL,在这个 URL 上描述了文档的缓存信息。 |
| xmlns | http://www.w3.org/1999/xhtml | HTML 不支持。只有 XHTML 支持。 规定 XML 的 namespace 属性(如果您需要您的内容符合 XHTML,则使用这个属性。)。 |
全局属性
<html> 标签支持 HTML 的全局属性。
如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039,我们一起飞!
篇文章介绍了<!--...--> 注释标签,我个人感觉很容易理解,在日常编码中,大多数编辑器都有注释标签的快捷键,如sublime或VS code里在html代码里,选中想要注释掉的代码后,直接按ctrl+/即可。几乎不用手动输入了。还是很方便的。
这篇我写<!DOCTYPE>标签,说起来这个标签,很常见,因为它会出现在每一个httml文档的最开头,然而,我们很少去重视它,为什么呢?
说到这个标签,我不得不说起html的版本历史了。
在大约10年前吧,html5应用还不如今天这么广泛吧,于是当时的文档类型声明如下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
很长,也很难记,由于我入行晚,懂得这玩意就只是一个声明了,比如strict表示严格模式。其他的我也不想知道了。
当然html版本的规范从4到5的过渡经历了太多年,因为要考虑老浏览器的兼容性,再加上前期移动设备配置低,不支持较为复杂的媒体元素。于是,一些资历深的前端开发人员,面对这么长的代码还是有很长一段时间。
当然,9102年都快过完了,我们这边已经不需要再考虑这些了,于是,我直接就用html5了。
然后声明文档给格式,就变得很简单了。
<!DOCTYPE html>
最开始我是使用sublime生成的模板练习的,然后,犯懒,直接输入了<html>就出来下面的代码:
<!DOCTYPE html> <html> <head> <title></title> </head> <body> </body> </html>
然后就开始进行填充了。
直到今天我才注意到原来<!DOCTYPE html>是单独的一行,与下方<html></html>是两码事。
所以,我重新看了下书上的强调内容:
关于SGML,参见https://wiki.mbalib.com/wiki/SGML
HTML 5
<!DOCTYPE html>
HTML 4.01 Strict
该 DTD 包含所有 HTML 元素和属性,但不包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional
该 DTD 包含所有 HTML 元素和属性,包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset
该 DTD 等同于 HTML 4.01 Transitional,但允许框架集内容。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
XHTML 1.0 Strict
该 DTD 包含所有 HTML 元素和属性,但不包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。必须以格式正确的 XML 来编写标记。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional
该 DTD 包含所有 HTML 元素和属性,包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。必须以格式正确的 XML 来编写标记。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset
该 DTD 等同于 XHTML 1.0 Transitional,但允许框架集内容。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1
该 DTD 等同于 XHTML 1.0 Strict,但允许添加模型(例如提供对东亚语系的 ruby 支持)。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
最后,虽然上方的html4和xml的文档类型声明这么麻烦了,但是这里没什么知识点了,因为如今,html5应用这么普及了,我们只需在文档开头写<!DOCTYPE html>即可,当然html4的严格模式和传统模式大概知道就行了。
*请认真填写需求信息,我们会在24小时内与您取得联系。