一、简介
1、前后状态的不同，叫做交互效果。有了人的操作，机器给了一个反馈。
2、Hypertext Markup Language 超文本标记语言
3、<html></html>根标签
<head></head>设置浏览器
<body></body>展示给用户
4、<meta charset = “utf-8”>一般都填这个
编码字符集：gb2312 国家编码字符集（简体，亚裔字符集）、gbk（gb2312+繁体）unicode 是万国码，包括了所有国家的语言
二、标签
1、<title></title>
2、<html lang = “en”>告诉搜索引擎爬虫，网站的内容 en 代表是英文，zh 是中文，德语是 de
3、<p></p>段落标签，让内容成段展示
4、标题标签，成段展示，独占一行，加粗字体，更改字体大小（从 1 到 6 依次减小）
如下：
<h1>one</h1>
<h2>one</h2>
<h3>one</h3>
<h4>one</h4>
<h5>one</h5>
<h6>one</h6>
5、strong加粗 em 斜体 del 中划线
<strong>加粗</strong>
<em>斜体</em>
<strong>
<em>又加粗又斜体</em>
</strong>
<del> 划线</del>
6、address 可以用斜体+成段展示
7、div 独占一行
span 不独占一行
div 和 span 这两个标签是为了成块展示，规格化，功能如下：
功能 1：分块明确，让整个页面更加结构化；
功能 2：捆绑操作的作用
8、br 换行
9、hr 水平线
10、有序列表
<ol>
<li>one</li>
<li>two</li>
<li>three</li>
<li>four</li>
</ol>
<ol type = “1”> 就以 ABC 排序， 改成 a，就以 abc 排序
此处的 type 值只有五个：数字，大写英文 A，小写英文 b，罗马数字大写 I，罗马数字小写 i
写成<ol type = “1” reversed = “reversed”> 就是倒序
如果想从第 2 个开始排序，就写<ol type = “1” start = “2”>
如果想从第55 个开始排序，就写<ol type = “i” start = “55”>
11、无序列表 ul，只有 type = “”可以改
<ul type = “disc”>
<li>one</li>
<li>two</li>
<li>three</li>
</ul>
type = “disc” 意思是 discircle，实心圆
type = “square” 意思是 square，实心方块
type = “circle” 意思是 circle，圈(空心圆)
ul 和 li 是一个很好的天生父子结构(柜子与抽屉)，可以做导航栏 ，可维护性好
12、<img src = “1.jpg style = “width:100px;”>
src 是 source 的缩写，img 的地址分：
1）网上 url
2）本地的绝对路径
3）本地的相对路径
如 html 和图片在同一文件下，是一种相对关系，相对路径，
写法<img src = “123.jpg”>
如 html 和图片不在同一文件下，是绝对路径，
写法<img src = “D:/a/b/c/123.jpg”>
alt 是图片占位符。当地址出错时，图不显示，来展示这个信息；图片没问题， 就不会展示这个信息
title 是图片提示符。当鼠标放上去，就会显示这个信息
- a标签
<a href = “https://www.taobao.com”>www.taobao.com</a>
href 是 hyperText reference 超文本引用
<a>标签可以包裹图片
<a>是 anchor --> 锚，定在某个点（置顶）
<a>标签的功能
1）超链接 2）锚点 3）打电话，发邮件 4）协议限定符
<a href = “https://www.baidu.com” target = “_blank”>target = “_blank”意思是在新标签中打开这个地址
<a href = “javascript:”>你点我试试</a>
写了 JavaScript 就可以在里面写 js代码 了
- form 表单，能发送数据，非常重要
<form></form>
form method = “get/post”这是 form 发送数据的两种方式
action = “http://ssffg.php”这是发送给谁，就是 action 的位置
form 表单里面还需要配合 input 来写，input 里面需要 type
<input type = “text”> //这个是输入框的意思
<input type = “password”> //这个是密码框的意思，默认是暗文
<input type = “submit”> //这个是提交的组件，也就是登录
<input type = “submit” value = “login”> //这样就改变了提交框的值
<input type = “radio”> //是单选框
<input type = “checkbox”> //是复选框
要注意语义化，用 p 标签更好，p 标签天生的功能就是换行
但这种方式发送不了数据
发送数据要注重数据的主题（数据名）和数据的内容（数据值），缺一不可，没有就发送不了数据
<input type = “text” name = “1234”> 此处 name 是数据名，1234 是数据值，此处 1234 可以随便填，最好填写接近意思的英文单词，方便使用
html？后面有值，就是发送成功的体现
另外，暗文是仅对自己不可见，受网安局监管的公司，一般用 md5，不可逆的加密方式
<input type = “radio” name = “star”>是单选框，此处的 name 里面的值一样的，是告诉浏览器你们是一道题，那么这个时候就没有填数据值的地方了，可以写个 value = “” 来储存数据值
默认选中 checked = “checked”
form 表单里面的组件 select，是一个下拉菜单，可以选值
在这种情况，数据名写在 select 里面更好，因为是天生的父子结构，而 option 标签中 间填的内容就相当于了一个数据值。如果写成<option value = “jc”>zjl</option>点提交，那么后台会使用 jc 这个属性
<select>
<option></option>
<option></option>
<option></option>
</select>
