一、html基础知识汇总
1.html介绍及作用
HTML全称HyperText Mark-up Language，指的是超文本标记语言。标记就是标签，例如：<a></a> <html></html>，一般标签都是成对出现，但是也存在单一出现的。如：<br> <img>。
超文本的含义：
1.网页中超越文本限制的还有图片、视频、音乐等
2.超链接文本：可以从一个网页中跳转到另一个网页中
作用：
用来开发网页
2.使用vscode来进行html编程
- vscode是一款开源免费的软件（个人使用感觉很好）
- 下载地址：https://code.visualstudio.com/Download
- vscode可以安装俩个插件。一个是汉化插件，另一个是浏览器运行插件。插件名分别为1.Chinese(Simplified) Language Pack for VS Code 2.open in brower。
- 可以点击以下图片显示图标，然后在后面的搜索框进行搜索（忽略电脑屏幕太脏）
- vscode的使用就不在过多赘述了，不会的同学可以自己参考一下CSDN的文章。
3.html一些常用的标签（包括单标签和成对出现的标签）
- 成对出现的
<h1>标题标签</h1>
<li>li标签定义列表项目</li>
<p>段落标签</p>
<div>div标签</div>
<a href='https://www.baidu.com'>百度</a>
- 单个出现的
<br>
<img src="图片路径" alt="图片描述信息">
注：标签的书写不区分大小写，但是一般都是小写！
- 设置图片的资源路径
分为绝对路径和相对路径。绝对路径是指从根目录开始书写，相对路径是从当前目录开始写。
4.标签种类
标签种类有三种：表格标签、列表标签、表单标签
- 列表标签
<ul>无序列表</ul>
<ol>有序列表</ol>
- 表格标签
<table>
<tr>
<th>table表示表格标签，tr表示表格中的一行，th表示表格中的表头</th>
</tr>
<tr>
<td>表示表格中的一列</td>
</tr>
</table>
- 表单标签
<form>标签 定义完整的表单标签
<label>标签 表示表单元素的文字标注标签，定义文字标注
<input>标签 表示表单元素的用户输入标签，定义不同类型的用户输入数据方式
type:
type="text"定义单行文本输入框
type="password"定义密码输入框
type="radio"定义单选输入框
type="chackbox"定义复选输入框
type="file"定义上传文件
type="submit"定义提交按钮
type="reset"定义重置按钮
type="button"定义普通按钮
<textarea>标签 定义多行文本输入框
<select>标签 定义下拉列表
<option>和<select>标签配合，定义下拉列表中的选项
- 表单提交时可以设置表单属性，action表示设置表单提交地址，method表示表单提交方式，分为get和post俩种。表单元素属性设置，俩个参数，name和value，name表示表单元素的名称，value表示表单元素的值。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 把数据提交给web服务器需要使用的表单标签：<form> -->
<form action="https://www.baidu.com" method="POST">
<!-- get方式提交数据到web服务器以地址栏的方式提交给web服务器，不安全，能看到提交的数据 -->
<!-- 严谨的说是以查询参数的方式提交给web服务器 -->
<!-- Post 方式提交表单数据会放到请求体里面 -->
<p>
<!-- for 根据id名给指定id的标签设置光标 -->
<label>用户名：</label>
<input type="text" name="username" >
</p>
<p>
<label>密码：</label>
<input type="password" name="password">
</p>
<p>
<label>性别：</label>
<input type="radio" name="gender" value="0">男
<input type="radio" name="gender" value="1">女
</p>
<p>
<label>爱好：</label>
<input type="checkbox" name="like" value="学习">学习
<input type="checkbox" name="like" value="打游戏">打游戏
<input type="checkbox" name="like" value="羽毛球">羽毛球
</p>
<p>
<label>照片：</label>
<input type="file" name="pic">
</p>
<p>
<label>个人描述：</label>
<textarea name="desc"></textarea>
</p>
<p>
<label>籍贯：</label>
<select name="position">
<option value="0">北京</option>
<option value="1">上海</option>
<option value="2">深圳</option>
<option value="3">西安</option>
</select>
</p>
<p>
<input type="submit" value="提交">
<input type="reset" value="重置">
<input type="button" value="按钮">
</p>
<!--get 和 Post 方式提交表单数据时都以HTTP协议的方式提交数据给web服务器 -->
</form>
</body>
</html>