一、HTML语法规范
1.1所有的标签都应该包括在<>里面,如<html>或</html>等,大部分的标签都是成对出现的,<>里没/的为开始标签,<>里有/的为结束标签,因为这些标签是成对出现的,所以也被称为双标签。
也有的是单个存在的,又被称为单标签,如<br />等,但是但标签比较少,所以可以重点的单独去记忆。
1.2标签关系
双标签关系分为两类,一类为包含关系,一类为并列关系。
<head>
<title></title>
</head>
<head>和<title>就为包含关系(包含关系也可以看作是父子关系)如下图:
<html>
<head></head>
<body></body>
</html>
<head>和<body>就属于并列关系(并列关系也可以看作是兄弟关系)如下图:
二、HTML基本结构标签
1、每个网页都会有一个基本的结构标签(也被称为骨架标签)
<html>
<head>
<title>我的第一个网页</title>
</head>
<body>
乾坤未定,你我皆是黑马
</body>
</html>
<html>标签把所有的标签都包括在里面,所以html标签是页面中最大的标签,也被称为根标签。
<head>标签是页面的头部标签。
<title>部分是网页标题,也可以叫文档标题。
<body>标签是网页的主体部分,网页中的内容基本上都是放在这个部分里面。
最后我们通过一个图来了解一下他们之间的具体关系:
html可以看成小猪佩奇,head看成是小猪佩奇的头部,title可以看成是小猪佩奇的眼睛,因为眼睛属于头的一部分,所以head和title属于包含关系,body可以看成是小猪佩奇的身体,,因为head和body构成了html,所以可以head和body属于并列关系。
三、网页的开发工具
以VSCode为例:VSCode的使用
1、双击打开软件。
2、新建文件(Ctrl+N)
3、保存(Ctrl+S),注意要保存为.html文件
4、Ctrl+加号键,Ctrl+减号键,可以放大缩小视图
5、生成页面骨架结构:
输入!按下Tab键。
6、利用插件在浏览器中预览页面:单击鼠标右键,在弹出出口中点击“Open In Default Browser”。