【HTML5+CSS3+JavaScript(ES6)】HTML篇

目录

1 前端简要介绍

1.1 课程导读

1.2 Web模型

1.3 CS架构和BS架构

1.4 浏览器选择和浏览器内核

1.5 Html、Css、JS介绍

2 VS Code

2.1 VS Code常用设置

2.2 VS Code常用插件

2.2 VS Code快捷键

3 HTML

3.1 标记语言

3.2 标签分类

3.3 标签属性

3.3.1 省略属性值的引号

3.3.2 单引号和双引号问题

3.3.3 实体引用（实体字符）

3.3.4 HTML中的空格

3.4 HTML结构

3.4.1 head标签

3.4.2 body标签

3.4.3 语义化

3.4.4 超链接

3.4.5 图片

3.4.6 相对路径和绝对路径

3.4.7 如何编写一个表格

3.4.8 表单

---

1 前端简要介绍

学习网站：

https://developer.mozilla.org/zh-CN/docs/Web

https://www.w3school.com.cn/

1.1 课程导读

1.2 Web模型

1.3 CS架构和BS架构

1.4 浏览器选择和浏览器内核

1.5 Html、Css、JS介绍

HTML介绍

HTML发展历程

第一个HTML案例

  







  这是展示内容-新的
  这是一段代码

前端开发工具的选择

2 VS Code

2.1 VS Code常用设置

格式化快键键：Shift+Alt+F

格式化设置：

2.2 VS Code常用插件

（1）文件图标主题

（2）自动命名标签（支持标签前后统一修改）

（3）页面英文翻译

（4）Liver Server

本地打开和Live Server打开区别：Live Server打开多一个同步刷新、更新的效果

2.2 VS Code快捷键

Shift+Alt+↓：复制当前行

Shift+Alt+F：格式化快捷键

Ctrl+Shift+K：删除一行

3 HTML

HTML中文官方文档推荐：developer.mozilla.org/zh-CN/docs/Web

3.1 标记语言

My cat is very grumpy

3.2 标签分类

    



    

    

    
    

    
    

    

    
    

    
    

    
    这是行内

    
    

3.3 标签属性

3.3.1 省略属性值的引号

3.3.2 单引号和双引号问题

3.3.3 实体引用（实体字符）

3.3.4 HTML中的空格

3.4 HTML结构

3.4.1 head标签

页面标题title：

元标签meta：

3.4.2 body标签

标题标签：

~

段落标签：

无序列表：

有序列表：

，type决定了排序的样式

3.4.3 语义化

强调标签：(emphasis)

加粗标签：

3.4.4 超链接

为图片添加超链接：

提示信息和跳转位置设置：

3.4.5 图片

3.4.6 相对路径和绝对路径

3.4.7 如何编写一个表格

跨列跨行:

3.4.8 表单

表单的功能说直白点就是：采集数据，收集数据

输入控件：

单选控件：

复选控件：

下拉控件：

文件上传控件：

method:get请求允许提交的数据量比较小，post请求支持提交的数据量比较大

enctype="multipart/form-data"：支持将文件以二进制的方式进行传输

隐藏域控件：

按钮控件：

控件禁用：

label标签：