1. <iframe>标签
<iframe>表示嵌套页面，默认大小为50*100。可以修改属性height和width.但是iframe的宽度可以设置百分比，高度却不可以。
下面是 <iframe>的一些属性的使用。
src ,表示嵌套页面的URL地址。记得不要写成href。
name ,表示嵌套页面的名字，可以用于<a>``<form>的target属性，或者<input>``<button>的formtarget属性。
frameborder, <iframe>标签默认在浏览器表现出的样式会有一个边框，使用这个属性可以消除这个丑丑的边框：frameborder="0"
2. <a>标签
<a>是一个锚元素，创建一个超链接。
下面是 <a>的一些属性的使用。
target表示在哪里显示超链接的内容。这个跟 <iframe>结合使用理解。
①_blank //在空白页打开超链接
②_self //在当前页面打开
③_parent //在爸爸身上打开
④_top //在祖先身上打开
⑤name //<iframe>的name，在该<iframe>身上打开。
③④的使用还是结合 <iframe>理解，在一个html页面嵌入了 <iframe>（假设叫a），则html页面是a的爸爸，类推，在a身上再嵌入一个新的 <iframe>（假设叫b），则html页面就是b的祖先。
download 建立一个下载的超链接。例如：<a href="#" download="下载名字">下载</a>
另外还有一种下载方法，用http响应决定 content-Type:application/ocet-stream
href 表示a的超链接地址URL，他支持多种协议。以下是href的集中情况：
①http协议或https协议。这个很容易理解：
<a href="http://www.qq.com">打开腾讯首页</a>
所以呢，前面的"http://"不可以缺少！！！！
②无协议相对地址。例如：<a href="//qq.com">打不开腾讯首页</a>这种情况下是打不开腾讯首页的。因为此时他自动继承了当前页面的协议（一般是文件协议file://xxx），此时可以在当前目录搭建一个http-server，那么当前页面的协议会变成http协议，在这个环境下才可以打开腾讯首页。
所以！！使用这个路径的话，访问腾讯首页时，不能关闭了http-server。
下载并打开http-server：
sudo npm i -g http-server cd xxxx(当前网页的目录) http-server -c-1然后复制给出的路径，在浏览器中打开。
123.png
③特殊字符路径
<a href="?name=qqq">qq</a> 这种情况在点击之后会在当前页面发起?name=qqq的请求
<a href="#xxx">qq</a>这个点击之后不会发起请求，锚点在当前页面进行跳转
<a href="/xxx.html ">link</a> 点击后会浏览器会发起GET / HTTP/1.1的请求，路径还是/，因为/已经是根目录，无法再往上走一个。
④伪协议
使用伪协议可以满足一种需求：点击了<a>标签不会发生任何跳转。
<a href="javascript:;">我就不动</a>
3. <form>标签
<form>和<a>的区别是，<form>发起的HTTP请求是 POST （file协议不支持POST请求），而<a>发起的是一个HTTP GET请求。
关于GET请求与POST请求的区别有一点：
- GET请求会将参数放在查询参数里面，也就是说当用户输入了参数之后，网页得到响应后，所有参数值都会显示在URL上。//GET是获取内容的请求。
- POST请求会默认将参数放在请求的第四部分。//POST是上传内容的请求。
关于请求修改，可以使用属性method。而action属性指定了参数POST传送的地方。
<form action="users?name=xxx" method="post">
<label>用户名<input type="text" name="username"></label>
<label>密码<input type="password" name="password"></label>
<input type="submit" value="提交">
</form>
<form>标签的子标签有交互式控件，接受来自用户的数据。有<input>``<textarea>``<button>等
注意！！，<form>标签内一定要有提交按钮。
4. <input>标签
<input>的type属性：如果不指定type属性，则默认为 text 。
①text：表文本。//password：表密码。
//建立一个用户登录的界面
<form>
<label><input type="text" name="username" >username</label>
<br>//换行
<label><input type="password" name="password" >password</label>
<input type="submit" value="提交">
</form>
<label>标签可以将文本信息跟交互控件关联在一起。如下图，是以上代码显示出来的。点击username焦点会自动到输入框中。
② button：表示普通按钮。//submit：表示提交按钮。
ps 有一个标签是<button>，它也有type属性，不同的是，这个标签如果不指定type属性，则它会默认为提交按钮。 注意<button>不是空元素。
③ checkbox：表复选框。//radio：表单选框
在实际场景，通常会有某一个命题，需要用户做选择。此时单选框的name属性需一致，这样同一组的单选按钮才可以起到单选的作用。而value为提交数据到服务器的值。如下面，可以设置一致的value，以便后端区分。
<form action="save.php" method="post" >
<label>性别:</label>
<label>男
<input type="radio" value="man" name="gender" ></label>
<label>女
<input type="radio" value="woman" name="gender" ></label>
<input type="submit" value="提交">
</form>
5. <select>标签与<option>标签。
<form action="#" method="post" >
<pl>爱好:</p>
<select>
<option value="reading">看书</option>
<option value="travel">旅游</option>
<option value="sport">运动</option>
<option value="shopping">购物</option>
</select>
<input type="submit" value="提交">
</form>
另外，<option>标签属性中，disable表示不可选，selected表示默认选项。
在<select>中加入multiple属性可以进行多选，进行多选时按下<kbd>Ctrl</kbd>同时进行单击。
6. <textarea>标签
<textarea>标签默认样式大小是可以经用户在浏览器上自行调整的，这样带来的坑是 页面布局会受到影响，要用CSS 来固定宽高样式。
