1、页面内跳转
当<a>元素用于页面内的锚点跳转时，应该先为该页面设置一些锚点，而定义锚点有两种办法：
- 通过<a>元素的name属性来定义，如：<a name="anchor-name">name属性的值就是锚点的名称<a>
- 通过其他元素的id属性来定义，如：<div id="anchor-name">id属性值可以作为锚点的名称</div>
设置好了锚点之外，就可以通过<a>元素链接到该锚点位置，其href取值为“# 锚点名称”，示例如下:
<a href="#anchor1">锚点链接一</a>
<a href="#anchor2">锚点链接二</a><div><div>我这里有很多内容...</div><!-- 使用a的name属性定义锚点 --><a name="anchor1">点击锚点链接一，会跳到我这里</a><div>我这里有很多内容...</div><!-- 使用元素的id属性定义锚点 --><p id="anchor2">点击锚点链接二，会跳转到我这里</p>
</div>
2、电子邮件链接
当其用于邮件连接时，href属性的值为"mailto: 邮件地址"，示例如下：
<a href="mailto:xuyc_brother@foxmail.com”>发送邮件给我</a>
3、电话链接
提供电话链接有助于用户查看连接到手机的网络文档和笔记本电脑，示例如下：
<a href="tel: 491570156"> 49 157 0156</a>
4、使用 download 属性保存画布为PNG格式
如果想允许用户下载一个HTML画布，可以创建一个下载属性和画布数据作为文件URL链接图像：
var link = document.createElement('a');
link.innerHTML = 'download image';link.addEventListener('click', function(ev) {link.href = canvas.toDataURL();link.download = "mypainting.png";
}, false);document.body.appendChild(link);
5、创建表单
5.1 <input>元素
<input>元素跟<img>元素一样，不需要闭合标签
<!-- 文本输入框 -->
<input type="text" name="username">
<!-- 文本输入框提示信息 -->
<input type="text" name="username" placeholder="用户名">
<!-- 搜索框 -->
<input type="search" name="search" placeholder="搜索">
<!-- 数字输入框 -->
<input type="number" name="age" placeholder="只能输入数字">
<!-- 密码输入框 -->
<input type="password" name="pwd" placeholder="密码">
<!-- 单选框 -->
<input type="radio" name="sex" value="man">男
<!-- 复选框 -->
<input type="checkbox" name="hobby" value="music">音乐
<!-- 隐藏域 -->
<input type="hidden" name="other-data" value="用户不可见数据">
<!-- 上传文件 -->
<input type="file" name="file">
<!-- 普通按钮 -->
<input type="button" name="button" value="普通按钮">
<!-- 提交按钮 -->
<input type="submit" name="submit" value="立即加入">
<!-- 重置按钮 -->
<input type="reset" name="reset">
5.2 <textarea>元素
用于多行文本输入，可以通过cols和rows属性来规定textarea的尺寸
<textarea rows="5" cols="30" placeholder="请输入评论"></textarea>
5.3 <select>元素
用于创建选项菜单，默认只能选择一个值，可以通过设置属性multiple="multiple"来实现多选，其选项元素为<option>元素，常用有两个属性：
- value：表示选中该选项的值。
- selected： 表示默认选中。
<!-- 单选且有默认选中值 --> <select name="tag"><option value="html" selected>HTML</option><option value="css">CSS</option><option value="js">JS</option> </select> <!-- 多选 --> <select name="tags" multiple="multiple"><option value="html">HTML</option><option value="css">CSS</option><option value="js">JS</option> </select>
5.4 <button>元素
一般对于提交与重置按钮，我们建议使用 input 来定义，对于普通按钮可以使用 button。
5.5 <label>元素
<label>元素用于关联表单元素的标题，可直接包裹表单元素，也可以通过设置其 for 属性关联到表单元素的 id 属性，这样点击 label 标题上关联的表单元素就可以自动获取焦点，提升用户体验。
<!-- 包裹表单元素 -->
<label>用户名：<input type="text"></label><!-- 使用for属性关联表单元素的id属性 -->
<label for="username">用户名：</label><input type="text" id="username">更多详细表单：HTML5中的表单元素
本文转载于:猿2048→https://www.mk2048.com/blog/blog.php?id=h0hb2c2j&title=HTML小记
