HTML第一章 注释与快捷键

1.注释与快捷键

• 注释（Ctrl + /）

  • 格式：<!-- 注释内容 -不参与代码的编译，对代码解释和说明的 -->

    <!-- 这是一个HTML文件 -->

• 常见快捷键

操作	名称
Ctrl + s	保存
Ctrl + x	剪切
Ctrl + c	复制
Ctrl + v	粘贴
Ctrl + z	撤销
Ctrl + a	全选
Ctrl + f	查询
Ctrl + /	注释
Alt + B	VScode运行
Shift + Alt + ⬇	复制整行到下一行
! + Enter	快速生成Html结构

• 基础结构

<!-- 标识当前文档类型为HTML5 -->
<!DOCTYPE html> 

<!-- HTML根节点/标签  lang="en" 表示这是一个英文文件  lang="zh-CN" 表示这是一个中文文件 -->
<html lang="en">

<!-- 文档头部 head 一般编写标题或者规定字符集或者引入其他资源文件 -->
<head>

    <!-- 面试题：meta  不在浏览器中显示内容，但是机器是可读的，为当前浏览器或搜索引擎提高服务 
            字符集
            !!  1. UTF-8  世界通用字符集
                2. gbk  中文字符集
                3. big5  中文繁体字符集
                4. GB2312  简体中文字符集
                4. ascii  英文字符集
    -->
    <!-- charset="UTF-8"  表示当前文档的字符集为UTF-8 -->
    <!-- viewport="width=device-width, initial-scale=1.0"  表示当前文档的视口宽度为设备宽度，初始缩放比例为1.0 -->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- 文档标题 title  表示当前文档的标题为Document，显示在浏览器的标签页上 -->
    <title>Document</title>
</head>

<!-- 文档主体 body 一般编写HTML代码，显示在浏览器的可视区 -->
<body>
    
</body>
</html>

• 标签

  • 格式：

    • 开闭标签 具备一个开标签<标签名>➕闭标签</标签名>

      <标签名 属性=值（可以为多个）></标签名>

      <html lang="en">

      </html>

    • 自闭合标签 只具备一个开标签，没有闭标签

      <标签名 属性=值（可以为多个）>

      <meta name="viewport" content="width=device-width, initial-scale=1.0">

  • 分类：

    1. 按照开闭分类：开闭标签、自闭合标签
    2. 按照是否换行分类：块级标签（会换行）、行内标签（不会换行）