HTML基础之html历史和简单规范

简介

HTML这个是所有人很常见的一种语言,其本身表示很难,其全程为超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。

历史

  • HTML1.0 1991年12月

    1991年万维网在互联网上首次路面,也随之引起了巨大的轰动。

    1889年,伯纳斯-李写了一份备忘录。提出建立一个基于互联网的昌吉文本系统。同年和另外一个工程师一起进行了联合自己申请,但是这个项目没有通过。

    1991年年底的说话,伯纳斯-李公开一份HTML Tag的文档,里面描述了组成HTML初始版本的18个元素。

  • HTML2.0 1995年11月

    HTML2.0是一HTML语言的扩展。

    与原始版本的HTML不同,HTML 2.0 被创建为Web标准,规定了常见的网页结构。

  • HTML3.2 1996年1月

    惨淡的第一个浏览器大战时期(Netspace VS IE),两大巨头不断的推出重大的措施试图控制整个领域,想要占领最高的话语权,网页的开发者是这场战争中的焦点。商业战争就像是军备竞赛,各个公司为了保持领先,招兵买马。各家都有各家的规则。整个社会开发者就很痛苦了,一个适用于网景浏览器,还要用户微软的浏览器。

  • HTML4 1997年12月

    浏览器大战接近尾声,W3C(世界万维网联盟)成立,整个组织打算通过制定同意的HTML标准,使整个产业能有序的发展。

    组织几乎用两种语言分离出HTML的表达式(HTML4.0)和结构(CSS),并且说服浏览器厂商接受这些标准。

    这次发布提供了规范的三种变体:

    • Strict :严格版本
    • Transitional:过度版本
    • Frameset iframe框架集

    HTML4.0采纳了许多浏览器特定的元素类型以及属性,但是同时也把Netspace的视觉化的标记提示为过时标签;赞成使用式表;

    同时在1998年4月对HTML4.0进行了微小的修订,没有增加增加版本号HTML5.0

  • HTML4.01 1999年12月

    像是HTML4.0一样提供了三个变体,并且最终错误修正版在2001年5月12日发布。

  • XHTML1.0 2000年1月

    各大浏览器厂商纷纷接受W3C标准的时候,新的技术出现了。HTML和另一种语言XML融合,XHTML(可拓展的超文本标记语言)它继承了HTML的通用型和浏览器的兼容性,继承了XML的严密性和可扩展性

  • HTML5 2014年10月

    HTML5是最新的修订版本,由W3C制定,目标取代1999制定的HTML4.01XHTML1.0标准

    (上面的历史是摘录他人的,对于发展历史还是需要简单的了解一下的)

其实聊了一些js,在创建ajax实例的时候,突然觉得还是将HTML也进行简单的讲解吧,好凑成一套,而HTML的一些基础相对来说比较容易过的,为了阅读方便将文章缩短可能会写的篇数偏多一些。

其实前端开发(Web Front-end development),是无法摆脱三个语言的:HTMLCSS以及JavaScript.

毕竟前端通俗的说就是涉及网页的,也就是网站的UI.我们经常打开网站,发现其页面布局,以及样式呈现,同意页面还有动态交互也就是数据会通过不同的操作会有不同的数据返回。而三个具体有承担了什么角色呢?

  • HTML: 结构布局,也就是大体的框架,像是房屋的结构梁。
  • CSS:样式的呈现,有点像是房屋的装修意思
  • JavaScript:这个就是行为逻辑,对页面操作的一些行为方法

现在先看一下HTML的具体格式吧。

具体格式

<html>
    <head>
       .....
    </head>
    <body>
     .....
    </body>
</html>

HTML的大体结构如上,而其中

html是根标签,也就是 与 之间的文本描述网页。

head和body平行的两个必须部分。

head标签用于定义文档的头部,它是所有头部元素的容器。 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。 文档的头部描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。 下面这些标签可用在 head 部分:, , ,

body是主体内容,也就是页面显示的内容,而后面很多的标签以及JSCSS等会放在整个标签下面。

规范

注释

所有的语言都有注释HTML 也不例外,其也有自己的注释

<!-- 这是一段注释 -->
注释格式如上

标签

标签其实又分单标签和双标签

<br></br> <!--这样成一对出现的,是双标签 -->
<br />    <!-- 这样的格式就是单标签 -->
1.双标签(对标签)
         a:成双成对出现,可以包含内容;
         b:有开始标签,有结束标签,结束标签在单词前有"/"
         例如:<title>某某教育</title>
2.单标签:
         a:只有开始标签,没有结束标签
         b:单标签在开始标签中结束,通常应该在单标签的大于号前加"/"表示结束
         例如:<meta charset="UTF-8"/>
         c:单标签的功能需要使用属性来实现,单标签不能添加内容。charset="UTF-8"就是这个单标签的属性,
         失去属性以后单标签就没有任何作用了。

声明

<!DOCTYPE html> <!-- 这个就是声明 -->
<html>
    <head>
       .....
    </head>
    <body>
     .....
    </body>
</html>

请始终向 HTML 文档添加 <!DOCTYPE>声明,这样浏览器才能获知文档类型。

<!DOCTYPE>声明必须是 HTML 文档的第一行,位于 标签之前,也就是文档的第一行。<!DOCTYPE>声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。

其实这个可以通过document.compatMode这个是得到HTML的兼容模式用来判断当前浏览器采用的渲染方式。

<!DOCTYPE html>
<html lang="en">
<head>

</head>
<body>
 <script>
    console.log( document.compatMode)
 </script>

</body>
</html>

在这里插入图片描述

<html lang="en">
<head>

</head>
<body>
 <script>
    console.log( document.compatMode)
 </script>

</body>
</html>

在这里插入图片描述

官方解释:

BackCompat:标准兼容模式关闭。
CSS1Compat:标准兼容模式开启。

Guess you like

Origin blog.csdn.net/u011863822/article/details/121775164