HTML初体验

HTML初体验

(一).HTML(超文本标记语言)骨架介绍

打开vscode,新建一个html后缀的文件,输入!+回车快捷生成一个骨架.这里属于使用emet语法,简单理解为代码的快捷生成方式.现在就可以开始写网页的结构了.

从上往下依次介绍html骨架.

1.<! DOCTYPE html>
版本号 ,表示html的第五个版本,html只有4和5两个版本.

2.< html lang=" ">
lang语言, en表示英文 ,zh-cn表示中文简体, 目的是为了浏览器分类方便管理.

3.头部:< head>< /head>.网页的头部,可以将head里面的内容看做是声明.

4.< mate charset=" ">
mate媒体标签,charset字符集,utf-8万国码,解决乱码问题
网页整体(根标签/根元素):< html>< /html>

5.< mate …contant=“IE=edge”>用来解决浏览器的兼容问题,这条语句的含义是默认以最新版本的IE或者edge浏览器打开显示.

6.< mate name=“viewport”…>解决移动端兼容性视口适配问题.

7.< title> 网页的标题</ title>打开网页,看到的如下图

8.seo三大标签(搜索引擎优化)
除了以上看到的语句,实际项目中还需要加入seo三大标签.

功能如图所示:

下图是三大标签在项目中的使用:

9.引入icon图标,该图标显示在标题内容的左侧

网页的主体结构如下,head中写声明,包含title标题,body中写网页的主体结构,内容.:
​ 头部:< head>< /head>

​ 身体:< body>< /body>

​ 标题:< title>< /title>,存在于head中

(二).拓展

html语言其实是由"标签"组成,使用它们可以搭建结构,添加网页内容.标签分为单标签和双标签,二者最明显的区别在于,双标签可以包裹内容.在后期的文章中将会详细介绍html中的标签.本篇针对初学者,对html骨架进行基本的介绍