认识 HTML

时间 2019-11-19

标签认识 html 栏目 HTML 繁體版

原文原文链接

什么是HTML

HTML实际上是 HyperText Markup Language 的缩写，超文本标记语言css

HTML的做用

一、首先利用记事本保存了一个标题和两段描述, 而后修改纯文本文件的扩展名为 .html，而后再利用浏览器打开html

郑伊健

郑伊健，1967年10月4日出生于中国香港，籍贯广东恩平，香港影视演员、流行男歌手。1988年参加新秀歌唱大赛加入无线电视，因拍摄“阳光柠檬茶”广告而入行，拜罗文为师。[1] 

1991年加盟BMG唱片公司以歌手身份出道。1995年开始，凭借在《古惑仔》系列电影中饰演陈浩南一角走红。1996年凭借《古惑仔》主题曲《友情岁月》得到十大中文金曲奖。1996年至1997年连续两次得到”台湾十大偶像”奖。

二、打开以后发现显示的格式不对，不对的缘由是由于在纯文本文件中全部文字都是同级别的，浏览器不知道哪些文字表明什么意思。也就是浏览器不知道哪些文字是标题，哪些文字是段落，因此致使了显示的格式不正确web
三、正是由于如此，因此 HTML 应用而生。HTML 就只有一个做用，它是专门用来描述文本的语义的。也就是说咱们能够利用 HTML 来告诉浏览器哪些是标题，哪些是段落。浏览器
- 这些用于描述其它文本语义的文本，咱们称之为标签。而且这些用于描述文本语义的标签未来在浏览器中是不会被显示出来的ide
- 因此正是由于 HTML 的这些标签是专门用来描述其它文本语义的，而且在浏览器中不会被显示出来，因此咱们称这些文本为"超文本"，而这些文本又叫作标签，因此 HTML 被称之为"超文本标记语言"网站
```
<h1>郑伊健</h1>

<p>郑伊健，1967年10月4日出生于中国香港，籍贯广东恩平，香港影视演员、流行男歌手。1988年参加新秀歌唱大赛加入无线电视，因拍摄“阳光柠檬茶”广告而入行，拜罗文为师。 </p>

<p>1991年加盟BMG唱片公司以歌手身份出道。1995年开始，凭借在《古惑仔》系列电影中饰演陈浩南一角走红。1996年凭借《古惑仔》主题曲《友情岁月》得到十大中文金曲奖。1996年至1997年连续两次得到”台湾十大偶像”奖。</p>
```
注意事项翻译
- 虽然咱们利用 H1 标签描述一段文本以后，这段文本在浏览器中显示出来会被放大和加粗，看上去咱们是利用 HTML 的标签修改了被描述的那段文本的样式。可是必定要记住，HTML只有一个做用，它是专门用来给文本添加语义的，而不是用来修改文本的样式的
H1标签它的做用是什么?code
- 错误：H1 标签能够用来修改文字的大小，而且还能够将文字加粗
- 正确：H1 标签的做用是用来告诉浏览器，哪些文字是标题。也就是 H1 标签是专门用于给指定的文字添加标题语义的

HTML发展史

IETF简介

IETF是英文 Internet Engineering Task Force 的缩写，翻译过来就是”互联网工程任务组“
IETF 负责定义并管理因特网技术的全部方面。包括用于数据传输的 IP 协议、让域名与 IP 地址匹配的域名系统（DNS）、用于发送邮件的简单邮件传输协议（SMTP）等

W3C简介

W3C 是英文 World Wide Web Consortium 的缩写，翻译过来就是 W3C 理事会或万维网联盟，W3C 是全球互联网最具权威的技术标准化组织
W3C于 1994 年 10 月在麻省理工学院计算机科学实验室成立。建立者是万维网的发明者 Tim Berners-Lee
W3C 负责 web 方面标准的制定，像 HTML、XHTML、CSS、XML 的标准就是由 W3C 来定制的

网页固定格式

一、编写网页和写信同样都有一套规范和要求，这套规范和要求中规定了写信的固定格式
二、写信基本结构

敬爱的湫兮:
      您好!
      正文正文正文正文正文正文正文正文正文正文正文正文
正文正文正文正文正文正文正文正文正文正文正文正文
      此致
敬礼!
                                                             你的朋友 伊健
                                                             2066年6月6日

三、编写网页的步骤：视频

3.一、新建一个文本文档htm

3.二、利用记事本打开

3.三、编写THML代码

3.四、保存而且修改纯文本文档的扩展名为.html

3.五、利用浏览器打开编写好的文件
四、网页基本结构：

<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
    </body>
</html>

五、经过观察咱们发现，HTML基本结构中全部的标签都是成对出现的，这些成对出现的标签中有一个带 / 有一个不带 / ，那么这些不带 / 的标签咱们称之为开始标签，这些带 / 的咱们称之为结束标签

html标签

做用：
- 用于告诉浏览器这是一个网页，也就是说告诉浏览器我是一个 HTML 文档
- 例如：
  - 指定网站的标题 / 指定网站的小图片
  - 添加网站的 SEO 相关的信息（指定网站的关键字 / 指定网站的描述信息）
  - 外挂一些外部的 css / js 文件
  - 添加一些浏览器适配相关的内容
注意点：
- 通常状况下，写在 head 标签内部的内容都不会显示给用户查看，也就是说通常状况下写在 head 标签内部的内容咱们都看不到

title标签

做用：
- 专门用于指定网站的标题，而且这个指定的标题未来还会做为用户保存网站的默认标题
注意点：
- title 标签必须写在 head 标签里面

body标签

做用：
- 专门用于定义 HTML 文档中须要显示给用户查看的内容（文字 / 图片 / 音频 / 视频）
注意点：
- 虽说有时候你可能将内容写到了别的地方在网页中也能看到，可是千万不要这么作，必定要将须要显示的内容写在 body 中
- 一对 html 标签中（一个 html 开始标签和一个 html 结束标签）只能有一对 body 标签

meta标签

一、为何会有乱码现象？
- 由于在编写网页的时候没有指定字符集
二、如何解决乱码现象？
- 在 head 标签中添加<meta charset="utf-8" />，指定字符集

HTML标签

HTML标签分类

单标签
- 只有开始标签没有结束标签，也就是由一个 <> 组成的
```
<meta charset="UTF-8" />
```
双标签
- 有开始标签和结束标签，也就是由一个 <> 和一个 </> 组成的
```
<html>
</html>
```

HTML标签关系分类

并列关系（兄弟 / 平级）

<head></head>
<body></body>

嵌套关系（父子 / 上下级）

<head>
    <meta charset="UTF-8" />
    <title>百度一下，你就知道</title>
</head>

文档声明

什么是文档声明？
- 因为 HTML 有不少个版本的规范，每一个版本的规范之间又有必定的差别。因此为了让浏览器可以正确的编译、解析、渲染咱们的网页，咱们须要在 HTML 文件的第一行告诉浏览器，当前这个网页是用哪个版本的HTML规范来编写的。浏览器只要知道了是用哪个版本的规范来编写以后，它就可以正确的编译、解析、渲染网页
文档声明格式：

<!DOCTYPE html>

注意事项
- <!DOCTYPE>声明必须是 HTML 文档的第一行，位于标签以前
- <!DOCTYPE> 声明不是 HTML 标签
- <!DOCTYPE> 声明没有结束标签
- <!DOCTYPE> 声明对大小写不敏感
- 这个声明浏览器会看，可是并非彻底依赖于这个声明，浏览器有一套本身的默认的处理机制
  - 不写也能运行
  - H5网页里面用H4也能运行