欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

初识HTML和WEB标准

程序员文章站 2022-09-26 16:59:33
什么是 HTML? * HTML 超文本标记语言的缩写(**H**yper **T**ext **M**arkup **L**anguage) * HTML 并不是编程语言,而是一种标记语言(markup language) * 标记 <英文单词或者字母>称为标记,一个HTML页面都是由各种标记组... ......

初识HTML和WEB标准

什么是 HTML?

  • HTML 超文本标记语言的缩写(Hyper Text Markup Language)
  • HTML 并不是编程语言,而是一种标记语言(markup language)
    • 标记 <英文单词或者字母>称为标记,一个HTML页面都是由各种标记组成。
    • 标记语言 一套标记标签(markup tag)
    • 标记语言 和编程语言有一个编译过程不一样,它是直接将HTML页面交由浏览器解析执行的。
  • HTML 使用标记标签来描述网页,用于描述超文本内容的显示方式,如字体,颜色,大小等。
    • 超文本 音频,视频,图片等视为超文本。
    • 这些标记标签在浏览器解析完展示给用户看的时候是不会出现在页面的。

HTML 有什么用?

  • 作用 HTML用于描述文档语义。(html中,除了语义,其他什么都没有)

什么是HTML 标签?

* HTML 标记标签通常被称为 HTML 标签(HTML tag)
* HTML 标签是由尖括号包围的关键词,如<html>。
* HTML 标签通常是成对出现的,如<p>和</p>。
* 标签对中的第一个标签是开始标签,第二个(通常带"/"号)标签是结束标签。
* 开始标签和结束标签也被称为开放标签和闭合标签。

HTML标签 有什么用?

  • 作用: 不同的HTML标签给文本不同的语义。
    • 面试的时候问你,h1标签有什么作用?
      • 正确答案: h1标签用于给文本增加主标题的语义,且一个页面中只能有一个h1标签(文章名称只能有一个)
      • 错误答案: h1标签用于给文字加粗,加黑,增大。

HTML 文档 = 网页

web 浏览器的作用是读取HTML文档,并将其以网页的形式显示,浏览器不会显示当中的HTML标签,而是使用标签来解析页面的内容。

  • HTML文档 用于描述网页。
  • HTML文档 包含HTML标签和纯文本。
  • HTML文档 被称为网页(通俗术语)
  • 网页 可以看成是由各种标记组成的一个页面。
    • 主页(首页) 网站的起始页面或者导航页面。

例:

<html>
    <!-- 放在此类标签是注释,<html> 与 </html> 之间的文本用于描述网页 -->
    <body>
        <!-- <body> 与 </body> 之间的文本是可见的页面内容主体正文 -->
        <h1> 主标题:铁乐与猫学习HTML </h1>
        <!-- <h1> 与 </h1> 之间的文本被显示为主标题,有且只有一个 -->
        <p> 正文段落:学习HTML的第一天。</p>
        <!-- <p> 与 </p> 之间的文本被显示为段落 -->
    </body>
</html>

初识HTML和WEB标准

WEB标准

  • w3c 万维网联盟组织,制定web标准的机构。
  • web标准 制作网页遵循的规范,它不是一个标准,而是一系列标准的集合
  • 网页主要由三部分组成:结构(Structure)、表现(Presentation)和行为(Behavior)
  • 对应web标准也分三方面:结构化标准语言、表现标准语言、行为标准。
    • 结构化标准语言:主要是XHTML和XML,用于描述网页。
    • 表现标准语言:主要是CSS,用于对网页进行美化。
    • 行为标准:主要包括对象模型(如W3C DOM)、ECMAScript等,JS让网页富有生命力,动态。

代码标准

  • 必須结束标记
    • HTML可以打开多个标签而不要求一定要写对应的结束标签来关闭它们。
    • 这在XHTML中是不合法的。另外约定俗成也必須带结束标记。
    • XHTML要求有严谨的结构,所有标签必须关闭。
    • 如果是单独不成对的标签,在标签最后加一个"/"来关闭它。

      * 双边标记 <span\></span>
      * 单边标记 <br>转成<br />
  • 小写元素
    • HTML对大小写不敏感,XHTML对大小写敏感
    • XHTML要求所有的标签和属性的名字都必须使用小写。
    • 大小写夹杂也是不被认可的。
      • 例dreamweaver自动生成的属性名字"onMouseOver"也必须修改成"onmouseover"。
  • 合理嵌套
    • 所有的嵌套都必須按顺序。

      * 例<p><b></p></b>必須修改为<p><b></b></p>
    • 一层一层的嵌套必須是严格对称。
  • 属性值加引号
    • 在HTML中,没有强制给属性值加引号,但在XHTML中,必須被加引号。

      * 例<height=90>必須修改为:<height="90">
    • 特殊情况需要在属性值中使用双引号时可以用相应代表的特殊符号去引用。
  • 特殊符号

    * 任何小于号(<),只要不是标签的一部分,都必须被编码为&lt;
    * 任何大于号(>),只要不是标签的一部分,都必须被编码为&gt;
    * 任何与符号(&),只要不是实体的一部分,都必须被编码为&amp;
    * 注:上面的特殊符号中间没有空格,且后面带分号。
  • 所有属性赋值
    • XHTML规定所有属性都必须有一个值,没有值的就重复本身。
  • "--"在注释中
    • “--”只能发生在XHTML注释的开头和结束,也就是说,在内容中它们不再有效。

以上标准虽然只在XHMTL中要求规范,HTML中不算不合法,但程序员默认还是要遵循它们的。

HTML的基本语法特征

  • HTML对换行不敏感,对tab不敏感,换多少行和tab多少都不影响页面的结构。
    • HTML并不依靠缩进来表示嵌套,而是直接看标签的包裹关系。
    • 但是良好的缩进有助于阅读和理解代码,所以最好还是正确的使用缩进标签。
  • 空白折叠现象
    • HTML中所有的文字之间,如果有空格、换行、tab都只会被折叠成一个空格显示。
  • 标签要严格封闭

HTML与XHTML

  • XHTML:Extensible Hypertext Markup Language,可扩展超文本标注语言。
    • 在XHTML中的字母X,表示“严格的”。
    • XHMTL与HTML4.0的标记基本上一样。
    • XHTML不同于HTML4.0,可称之为严格严谨的、纯净的HTML。
    • XHTML的主要目的是为了规范HTML4.0,也可以理解为HTML4.0的升级版。
    • 但是真正的升级版,HTML5极大的简化了DTD(规范),也就是说HTML5中就不用区分XHTML和HTML了。
  • HTML的标记书写很不规范,有可能会造成其它的设备(ipad、手机、电视等)无法正常显示。
    • HTML4.01里面规定了普通和XHTML两大种规范。
    • HTML4.01这个版本是IE6开始兼容的。
    • HTML5是IE9开始兼容的。

文:铁乐与猫

2018-5-21

参考

1、HTML简介

2、html介绍和head标签

3、baidu百科:web标准