vscode笔记——HTML结构

雨连绵

已于 2022-03-11 15:15:10 修改

阅读量1.5k

点赞数

文章标签： vscode

于 2022-03-11 11:23:57 首次发布

本文链接：https://blog.csdn.net/weixin_59122579/article/details/123420298

版权

<!DOCTYPE html>

<!DOCTYPE html>声明HTML文档的解析类型，避免浏览器怪异模式（奇怪的画面）。

一般用于文件第一行开始处，jsp中添加在

<%@ page%>

的下一行，不区分大小写

使用此解析之后浏览器会按照W3C的标准解析页面

以下为截图自bilibili（IT程序员老王）的视频截图：

一、HTML标签

HTML 各种标签参考网址

1.1网页结构

在vscode中第一行打入英文感叹号（!）随后根据自动生成的感叹号进行回车（Enter）：

然后会出现如以下代码段：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

即为vscode快速生成网页结构。

1.2 lang标识符

<html>的标签中可以添加上“lang”：

<html lang="xx">

其中"xx"即为HTML的标识符，自取亦可，vscode自动生成也可

1.3HTML的<head>结构

<head></head>是封闭的头部标签。

在头部标签之间可以放入的头部元素有：<base>、<link>、 <meta>、 <script>、<style>、 <title>等。

1.4HTML的<body>结构

1.5标题标签

<!-- h1是最大的标题，h6是最小的标题 -->

这6个"h"标签是上班会用到的

代码如下：

<body>
    <div>连绵的html页面</div>
    <div>
        <span>标题标签</span>
        <h1>h1</h1>
        <h2>h2</h2>
        <h3>h3</h3>
        <h4>h4</h4>
        <h5>h5</h5>
        <h6>h6</h6>
    </div>
</body>

由该代码演示图例如下：

1.6段落标签

<p></p>即为段落标签