了解HTML标签
-
HTML代码是由标签组成的 例如:
<body>hello world</body>1.< body > < /body >就是一对完整的标签,一对标签需要一个起始标签和一个结束标签,结束标签开头是一个 / 来表示这对标签的结束,例如:< /body >。
2.在开始标签和结束标签之中的内容,就是这个标签需要具体展示的内容 hello world。
3.大多数标签都是上述这种双标签的结构,只有少数标签是单标签。我们还可以给这个标签设置一个唯一的id,id相当于给这个标签设置一个唯一的身份标识。<body id = "my_id"> hello world </body>
注意:id是在开始标签内进行设置的。
HTML文件的基本结构
<html >
<head>
<title>第一个页面</title>
</head>
<body>
hello world
</body>
</html>
- html标签是整个html文档的最顶层标签/根标签
- head标签则是写这个html文档的属性的标签
- title标签则是显示这个文档的标题标签
- body标签中的内容则是需要显示在页面上的内容
标签的层次结构
父子关系
在上述代码中html标签就是所有标签的父标签,head标签是title标签的父标签
兄弟关系
head标签和body标签就是兄弟关系。
快速生成代码框架
table之后生成代码:
细节解释:
- < !DOCTYPE html> 称为 DTD (文档类型定义), 描述当前的文件是一个 HTML5 的文件。
- < html lang="en"> 其中 lang 属性表示当前页面是一个 "英语页面". 这里暂时不用管. (有些浏览器会根据此处的声明提示是否进行自动翻译)。
- < meta charset="UTF-8"> 描述页面的字符编码方式. 没有这一行可能会导致中文乱码。
- < meta name="viewport" content="width=device-width, initial-scale=1.0"> name="viewport" 其中 viewport 指的是设备的屏幕上能用来显示我们的网页的那一块区域,content="width=device-width, initial-scale=1.0" 在设置可视区和设备宽度等宽, 并设置初始缩放为不缩放. (这个属性对于移动端开发更重要一些)。