插入

Web‑HTML 文字、图片、表单 完整知识点+完整代码

一、文字标签

1.  <h1~h6> ：标题，h1最大，h6最小，独占一行
2.  

 ：段落文本，段落之间有空行
3.   ：行级文字，不会自动换行

html

标题文字

这是一段段落文字

行内文字  

二、插入图片：单标签

属性：

1. src：图片路径（必填）
2. alt：图片加载失败时显示文字
3. width、height：宽高（只写一个，图片等比缩放）

语法：

html

< img src="img/1.jpg" alt="风景图" width="200">

路径分两种：

• 相对路径：同级直接写文件名；文件夹里就写文件夹名/图片名
• 绝对路径：完整网址

三、表单

作用：收集用户输入信息（账号、密码、单选、复选框、按钮），用来提交给后端。

form属性

• action：提交数据的地址
• method：提交方式，get/post

常用input类型

1. text 单行文本框
2. password 密码框
3. radio 单选框（name必须一致才实现互斥）
4. checkbox 复选框
5. submit 提交按钮
6. reset 重置按钮

完整整合代码（文字+图片+表单）

html

用户注册

请填写个人信息

< img src="logo.png" alt="logo" width="100">

账号：

密码：

性别：
男
女

爱好：
游戏
看书

 

考试必背总结

1. 文字：h1‑h6、p、span
2. 图片标签： < img src="" alt=""> （单标签）
3. 表单外层： 

• get：参数拼接在网址上，不安全，数据量小
• post：数据放请求体，适合登录注册