a标签
- 当我们想从本页面跳转到其他的页面的时候，这时就可以使用a标签
<a href="http://www.qq.com">腾讯首页</a>
target属性
- 此时是跳转是当前页面跳转，但如果我们想在新开的窗口的跳转怎么办呢（在新窗口打开页面显然更人性化）
这时我们就要用到了target属性
<a href="https://www.qq.com" target="_blank">腾讯首页</a>
- target显然不止只有这一个属性，它还有
- _self:当前页面加载。此属性是默认的。
- _blank: 跳转到新页面。
- _parent:在它的父窗口打开，比如在页面里有iframe的窗口，那么就在调用iframe的页面打开腾讯首页。
- _top:在顶层窗口打开，换句话就是在它的祖先打开。
- 另外target还有一个用法，就是和iframe连用。
<iframe name=tencent src="#" frameborder="0"></iframe>
// 首先给iframe起个名字
<a href="https://www.qq.com" target="tencent">腾讯首页</a>
// 接着在target里写上我们刚刚起的名字
// 效果：当我们点击a标签时，会在iframe的窗口里打开腾讯首页
download属性
<a href="https://www.qq.com" download>腾讯首页</a>
//另外一种不用download属性,设置响应头
// content-type: application/octet-stream
href属性
- 错误写法
<a href="qq.com">qq</a>
这种写法错在没有加上https协议，这样浏览器会把qq.com当成文件来去访问
- 无协议写法
<a href="//qq.com">qq</a>
这种写法会按照当前所使用的协议来访问qq.com。如果当前使用的是HTTPS协议，则会自动补全为https://www.qq.com。如果当前使用的是file协议，则不能访问qq.com。 因此我们并不建议这种写法
- 伪协议
<a href="javascript: alert(1);">使用一段js代码</a>
这种写法和https协议的写法很类似，但我们知道JavaScript并不是一种协议，因此我们把这种写法称之为伪协议写法。其作用就是执行一段js代码。但很少有人会在a标签里写代码，实际上，它还有一种特殊且被广泛使用的写法。
- 你怎么点我也没有
<a href="javascript:;">点我也没用</a>
有时候我们会想要这样的效果：它是a标签且有连接，但我们又希望它什么都不做，就可以这样子写。
难道只有这一种写法吗？我href里不写东西可以吗？我们来对比一下其他写法会有怎样的效果：
| 不写href | href="" | href="#" |
|---|---|---|
| 此时a标签没有下划线且不可点击 | 点击之后刷新页面 | 点击之后回到顶部 |
显然用伪协议的写法更好，因为它什么都不会做。
form标签
<form action="uesers"method="post">
<input type="submit" value="提交">
</form>
- a标签跳转页面发起的是GET请求，而用form标签可以发起post请求，GET通常用来获取页面，而POST通常用来上传数据
- form标签默认是GET请求
- 当form标签里有button时，此时button默认为提交按钮
<form action="users"method="post">
<input type="text" name="username" id="usname">
<input type="text" name="password" id="pdw">
<button>提交</button>
</form>
// 此时的button和上面的input功能一样
但如果button这样子写，就没有提交功能了
<form action="users"method="post">
<input type="text" name="username" id="usname">
<input type="text" name="password" id="pdw">
<button type="button">提交</button>
</form>
此时的button并没有什么卵用，它就和<input type="button" value="提交">一样，仅仅只是一个button
- form表单里的复选框
<input type="checkbox" id="apple">苹果
这样子也可以，但点击苹果时没有反应，我们更希望点击苹果时，勾选框也能选上。改进之后的代码
<input type="checkbox" id="apple"><label for="apple">苹果</label>
有时候我们懒得起名字，因此还可以这样写：
<label for="apple"><input type="checkbox" id="apple">苹果</label>
- 单选按钮
<input type="radion">选项A
<input type="radion">选项B
<input type="radion">选项C
<input type="radion">选项D
这样子，四个选项都可以勾选，但是有时候我们只想选择其中的一个，那么可以这样子写：
<input name="onlyOne" type="radio">选项A
<input name="onlyOne" type="radio">选项B
<input name="onlyOne" type="radio">选项C
<input name="onlyOne" type="radio">选项D
- 下拉列表
<select name="group" >
<option value="1">一</option>
<option value="2">二</option>
<option value="3" disabled>三</option>//不可选
<option value="4" selected>四</option>//默认选中
</select>
table标签
table标签很好理解，动手写一遍就明白了。
<table>
<colgroup>
<col width=100>// 规定第一列的宽度
<col bgcolor=red>// 规定第二列的背景颜色
<col width=200>// 规定第三列的宽度
</colgroup>
<thead>
<tr>// table row
<th>1</th><th>1</th><th>1</th>// table head
</tr>
</thead>
<tbody>
<tr>
<td>1</td><td>2</td><td>3</td>// table data
</tr>
</tbody>
<tfoot>
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
</tfoot>
</table>
iframe标签
iframe标签的作用就是打开一个窗口,但现在似乎已经不常用了.
<iframe src="http://qq.com" frameborder="0"></iframe>
iframe默认是高度是50，宽度是100。我们可以用css来设置它的宽高，但在css里你可以设置宽为100%，但却不可以设置为高100%，真是令人蛋疼。
