美文网首页
HTML基础-认识HTML

HTML基础-认识HTML

作者: 香泡泡 | 来源:发表于2018-12-03 15:59 被阅读15次

什么是HTML?

其实是HyperText Mark Lauguage的缩写,超文本标记语言。

HTML的作用?

首先利用记事本保存了一个标题和两段描述,然后修改纯文本文件的扩展名为.html,再利用浏览器打开—打开之后发现现实的格式不对,不对的原因是在纯文本文件中所有文字都是同级别的,浏览器不知道那些文字代表什么意思,也就是浏览器不知道哪些文字是标题,哪些文字是段落,所以导致了显示的格式不正确,正因为如此,所以,HTML应运而生,HTML是专门用来描述文本的语义的,也就是说我们可以利用HTML来告诉浏览器哪些是标题,哪些是段落。

这些用于描述其他文本语义的文本,我们称之为标签,并且这些用于描述其他文本语义的标签将来在浏览器中是不会被显示出来的。

所以因为HTML的这些标签是专门用来描述其他文本语义的,并且在浏览器中不会被显示出来,所以我们称这些文本为“超文本”,而这些文本又叫做标签,所以HTML被称之为“超文本标记语言”。

注意事项:

虽然我们利用【h1】描述一段文本后这段文本在浏览器中显示出来会被放大和加粗,看上去我们是利用HTML的标签修改了被描述那段文本的样式,但是一定要记住,HTML的作用只有一个,它是专门用来给文本添加语义的,而不是用来修改文本的样式。

错误:H1标签可以用来修改文字的大小,并且还可以将文字加粗。

正确:H1标签的作用是用来告诉浏览器,哪些文字是标题,也就是H1标签是专门用于给指定文字添加标题语义的。

HTML的发展史

IETF简介

W3C简介(web)

网页的固定格式

编写网页的步骤:

1.新建一个文档

2.利用记事本打开

3.编写HTML代码

4.保存(ctrl+s)并修改纯文本文档的扩展名.html

5.利用浏览器打开编写好的文件

基本结构

<html>

    <head>

        <title></title>

    </head>

    <body>

    </body>   

</html>

通过观察我们发现,HTML基本机构中所有的标签都是成对出现的,这些成对出现的标签中,有一个不带/(开始标签),一个带/(结束标签)。

注意:shift+<, shift+>  , /,  Tab键

<html> 标签的作用:

用于告诉浏览器,这是一个网页,也就是说告诉浏览器我是一个HTML文档。

注意️:其他所有的标签都必须写在html标签里面,也就是写在html开始标签和结束标签中间。


<head>标签的作用

用于给网站添加一些配置信息

例如:

-指定网站的标题;

-指定网站的小图片;

-添加网站的SEO相关的信息(指定网站的关键字,指定网站的描述信息);

-外挂一些外部的css,js文件;

-添加一些浏览器适配相关的内容.

注意:

一般情况下,写在head标签内部的内容都不会显示给用户查看,也就是说写在head内部的内容,我们都看不到。


<title>标签的作用

专门用于指定网站的标题,并且这个指定的标题还会作为用户保存网站的默认标题。

注意:title标签必须写在head标签里面

ctrl+d-保存网页

<body>标签的作用

专门用于用于定义HTML中需要显示给用户查看的内容(文字,图片,音频,视频)

注意:

1.虽然有时候你可能将内容写到了别的地方在网页中也能看到,但是千万不要这么干,一定要将内容写在body中。

2.一对html标签中只能有一对body标签。


字符集问题

meta标签的作用:

就是指定当前网页的字符集

为什么会有乱码现象?

就是因为我们在编码网页时没有指定字符集。

如何解决乱码现象?

在head标签中添加<meta charset= “GBK”/>

什么是字符集?

字符集就是字符的集合,也就是很多字符堆在一起,相当于古代的活字印刷术,在活字印刷术中就是将很多刻有小字的小章放到一个盒子中,然后需要印刷文字的时候再去盒子中取这个小章出来用,正是因为如此,所以导致了乱码问题.

假设北方人和南方人都拥有装满小章的盒子,但是南方人和北方人在盒子中存储小章的顺序不太一样,那么这个时候如果北方人和南方人都需要去取“李”字,在南方人的记忆中李字在第六个盒子的第六行第六列中(666),在北方人的记忆中李字在第八个盒子的第八行的第八列中(888),那么此时如果让一个南方人去北方人的盒子中取“李”字的小章,必然找不到,因为存储顺序不一样,而导致了乱码问题。

那么这个地方北方人存储小章的盒子和南方人存储小章的盒子就对应网页中指定的那些字符集,在网页中我们常见的字符集有两个,GBK/UTF-8,GBK对应北方人存储的盒子,UTF-8就对应南方人存储的盒子。

所以在网页中指定字符集的意义就在于告诉浏览器我用的是哪个盒子,你应该如何去查找才能找到对应的正确的内容。


GBK(GB2312)和UTF-8的区别

GBK(GB2312)里面存储的字符比较少,仅仅存储了汉字和一些常用的外文,体积比较小。

UKF-8里面存储了世界上所有的文字,体积比较大。

那么在企业开发中,我们应该使用GBK(GB2312)还是UKF-8?

如果你的网站仅仅包含中文,那么推荐使用GB2312,因为它的体积更小,访问更快。

如果你的网站除了中文以外,还包含了一些其他国家的语言,那么推荐UKF-8。

懒人推荐UKF-8

注意:在HTML文件中指定的字符集和保存这个文件的字符集一致,否则还是会出现乱码。


HTML标签的分类

双标签

有开始标签,结束标签组成的标签

单标签

由一个<>组成的标签

HTML标签关系的分类

并列关系

嵌套关系(父子关系)

什么是DTD文档申明?

由于HTML有很多个版本的规范,并且每个版本之间有一定的差异,为了让浏览器正确的编译,解析和渲染我们的网页,我们需要在HTML文件的第一行告诉浏览器,我们当前的网页是用哪个版本的HTML规范来编写的,浏览器只要知道我们是用哪个版本的规范来编译以后,就能够正确地编译,解析,渲染我们的网页。

DTD文档申明格式

每一个不同版本规范都有不同的文档申明规范

HTML5的DTD文档申明:

<!DOCTYPE html>

编辑在代码页的第一行

DTD文档申明注意点

1.任何一个标准的HTML网页第一行一定是DTD文档什么。

2.DTD文档申明不区分大小写。

3.DTD文档不是一个标签。

4.虽然DTD文档声明的作用是用于告诉浏览器我们的网页是用哪一个版本的标准编写的,以便于方便浏览器解析和渲染,但是浏览器并不是完全依赖这个DTD文档声明,浏览器有一套属于自己的机制,也就是说,DTD文档什么不写,网页也能正常运行,但是W3C规定第一行必须写上DTD文档声明,所以为了遵守规定,无论怎么我们都应该在第一行写上DTD文档声明。

www.W3school.com.cn

HTML的DTD文档声明

XHTML的DTD文档声明

HTML XHTML和HTML5之间的区别

HTML:语法非常宽松,容错性强

XHTML:更为严格,他要求标签必须小写,必须严格闭合,标签中的属性必须用引号等。

HTML5:是HTML的下一个版本,所以除了容错性强以外,还增加了许多新的特征。

.htm和.html扩展名区别

相关文章

  • HTML基础-认识HTML

    1.编写网页和写信一样都有一套规范和要求, 这套规范和要求中规定了写信的固定格式 2.写信基本结构 敬爱的明哥:您...

  • ## HTML基础-认识HTML

    ## HTML基础-认识HTML # head标签 # title标签 # body标签 # meta标签(字符集...

  • HTML基础-认识HTML

    HTML是什么 HTML是HyperText Markup Language的缩写,超文本标记语言。 HTML的作...

  • HTML基础-认识HTML

    HTML基础-认识HTML HTML是给文本添加寓意的 -其他所有标签必须全部写在html标签里面

  • HTML基础-认识HTML

    什么是HTML? 其实是HyperText Mark Lauguage的缩写,超文本标记语言。 HTML的作用? ...

  • HTML:前端基础 & 认识 HTML

    学习目标 理解HTML 标签的概念、分类、关系和语义化 应用HTML 骨架格式sublime 基本使用 1. HT...

  • HTML5入门

    html基础-认识html 1.html的基本结构 2. DTD文档声明 3...

  • 02HTML基础-认识HTML

    1. 字符集问题 Meta标签的作用,就是指定当前网页的字符集 ——为什么会有乱码现象? 就是因为我们在编写...

  • 01HTML基础-认识HTML

    什么是HTML HTML其实是HyperText Markup Language的缩写, 超文本标记语言 HTML...

  • 01HTML基础--认识HTML

    什么是HTML HTML是Hyper Text Markup Language的缩写,即超文本标记语言。 HTML...

网友评论

      本文标题:HTML基础-认识HTML

      本文链接:https://www.haomeiwen.com/subject/pkgycqtx.html