关于html的一些总结

#html ###元素 1、base：设置相对URL的基础；
2、meta：提供关于文档的信息；
3、noscript：包含浏览器禁用脚本或不支持脚本时显示的内容。 ###划分内容 1、details：生成一个区域，用户将其展开获得更多详细知识；
2、summary：用在details元素中，表示该元素的标题或说明。
3、section：表示一个重要的主题或概念
4、header、footer：表示头部和尾部
5、nav：导航元素
6、hgroup：表示一组标题，其中只有第一个可出现在文档大纲中
7、 ###制表 1、caption：表示表格标题；
2、tr：一行单元格；
3、th：表示标题行单元格；
4、td：表示单元格； ###元素属性 1、target：告诉浏览器如何打开单元格 ###meta元素

<meta name="author" content="Yan de huan">
当前页的作者姓名

<meta name="description" content="myself">
当前页的说明

<meta name="robots" content="noindex">
告诉搜索引擎如何对待该文档，noindex：不要索引本页；noarchive：不要将本页存档或缓存；nofollow：不要顺着本页的链接继续搜索下去；

<meta http-equiv="refresh" content="5;http://www.baidu.com">
该代码作用让浏览器每隔5秒加载www.baidu.com
http-equiv属性的用途是指定所要模拟的标头字段名称，字段值则由content属性指定
meta元素的http-equiv属性允许使用的值
default-style：指定页面优先使用的样式表。对应的content属性值应与同一文档中某个style元素或link元素的title属性值相同；
content-type：这是另一种声明html页面所用字符编码的方法。如：
<meta http-equiv="content-type" content="text/heml charset=UTF-8">

###style 1、style元素的media属性用于确定所使用的设备，例如screen计算机显示屏幕；print打印文档；handheld手持设备 ###link 1、属性rel：说明文档与所关联 资源的关系类型，rel对应的值：

author：链接到文档的作者
help：链接到当前文档的说明文档
alternate：链接到文档的替代版本，比如另一种语言的译本
icon：指定图标资源
license：链接到当前文档的相关许可证
pingback：指定一个回探服务器。从其他网站链接到博客的时候他能自动得到通知
prefetch：预先获取一个资源
stylesheet：载入外部样式表
添加网站标志<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

###script执行顺序

defer：告诉浏览器要等页面载入和解析完毕之后才执行脚本
async：同时加载页面和脚本，异步执行脚本
例子：

<script defer src="...">

###表单

1、form元素的action属性或者button元素的formaction属性：指定表单数据发送到的URL
2、控制表单的自动完成功能：将表单form元素的autocomplete属性设置为禁用，他的值有两种，on和off，其默认值是on，表示允许浏览器填写表单。
3、自动聚焦到某个input元素：添加属性autofocus，例如：

<input autofocus>

4、对表单元素编组，fieldset元素，将input包裹住即可
5、为fieldset元素添加说明标签：legend元素，必须是fieldset元素的第一个子元素
6、使用表单外的元素 ###定制input元素 1、maxlength="Num"：设置用户能够输入的字符最大数目；size="Num"：设置文本框能够显示的字符数目
2、设置初始值和占位符提示：如果是提示用户输入什么样的数据，那就应该使用placeholder；如果想要提供一个默认值，使用value属性
3、input元素获取数值：

<input type="number" step="1" min="1" max="100" value="1">
step指定上下调节数值的步长；value初始值

4、获取指定范围内的数值

<input type="range" step="1" min="1" max="100" value="1">

5、获取颜色type="color"
6、获取搜索用词type="search"
7、用input元素生成图像按钮和分区相应图

<input type="image" src="accept.png" name="submit">

8、用input上传文件

<input type="file" name="filedata">

###其他表单元素及输入验证

1、optgroup元素可以用来在select元素的内容中建立一定的结构
2、输入验证：required--检查用户是否提供了一个值，如没有提供，则无法提交；使用方法如下：

<input type="text" required>	

3、确保输入值与指定模式匹配--使用pattern属性

<input type="text" pattern="^.*内容.*$">

4、同理确保输入值是邮箱

<input type="text" pattern="^>*@qq.com.*$">

###嵌入内容

1、创建客户端分区相应图--点击某张图像上的不同区域让浏览器导航到不同URL上，关键元素是map

<img src="" usemap="#mymap" alt="">
<map name="#mymap">
	<area href="" shape="" coords="" alt="">
	<area href="" shape="" coords="" alt="">
	<area href="" shape="" coords="" alt="">
</map>
map元素必须包含area元素，area元素的属性分为两类：
一、area所代表的图像区域被用户点击后浏览器导航到的URL；
二、代表不同的图像区域：
  shape属性和coords属性，其中shape属性的值有rect代表矩形，coords属性必须有四个用逗号隔成的整数组成，分别代表：图像的左边缘和矩形的左侧，上上，左右，上下；
  shape属性的值circle代表圆形区域，coords属性必须由3个整数组成，分别是：从图像左边缘到圆心的距离，上边缘到圆心的距离，圆的半径；
  shape属性的值default，这个值的意思是默认区域，shape属性使用这个值是不需要提供coords值

转载于:https://my.oschina.net/crazypineapple/blog/700587