*学习笔记
link扩展
link是引入外部文件的一个作用
添加网址标题栏前的小图标:
<link rel="icon" type="/image/x-icon" href="http://www.mobiletrain.org/favicon.ico">
dns解析,访问网站资源会更快
<link rel="dns-prefetch" href="//static.36buyimg.com">
meta标签扩展
meta是添加辅助信息,优化和渲染的作用
charset属性: <meta charset="UTF-8">
name属性:
描述 <meta name="description" content="这是添加的网站描述">
针对双内核产生的一个渲染<meta name="renderer" content="webkit">
关键字 <meta name="keywords" content="美食,酒店,团购">
3秒自动跳转 或刷新<meta http-equiv="refresh" content="3" url="">
H5 新语义化标签
header 页眉
footer 页脚
main 主体
hgroup 标题组合
nav 导航
article,用于定义定义页面上下相对独立的信息区域。
section元素,用于定义一个内容区域。
aside,用于定义article信息相关联信息。
details元素,用于描述页面中文档的某部分细节信息。
detalist元素,用于定义数据集合,通常与input元素结合使用。
progress 进度条
H5表单扩展
empty-cells: hide; /*隐藏空单元*/
border-collapse: collapse;/*添加表格单线*/
新input控件
email 邮件地址输入框
url 网址输入框
number 数值输入框
range 滑动条
date/month/week 日期控件
search 搜索框
color 颜色控件
tel 电话号码输入框
time 时间空间
<form action="http://www.baidu.com">
<!--<input type="email">-->
<!--<input type="url">-->
<!--<input type="number" min="0" max="10" value="8"-->
<!--<input type="range">-->
<!--<input type="date">-->
<!-- <input type="month">-->
<!-- <input type="week">-->
<!--<input type="search">-->
<!--<input type="color">-->
<!--<input type="tel">-->
<!-- <input type="time">
<input type="submit">
</form>
新的表单属性
autocomplete 自动补全 默认值为 on
autofocus 获取焦点
required 不能为空
pattern 正则验证
placeholder 提示
<form action="http://www.baidu.com">
<input type="text" name="username" autocomplete="off" autofocus required>
<input type="submit">
</form>