H5泛指: html css js 三个方向的提升 语义化标签 表单类型 过渡 转换 背景 盒子阴影 盒子边框圆角 本地存储 历史管理 拖拽事件 多媒体
属性选择器
[attr=value] 选中属性名称为attr且值完全等于value的元素
[attr=^value] 选中属性名称为attr且值以value开头的元素
[attr$=value] 选中属性名称为attr且值以value结尾的元素
[attr*=value] 选中属性名称为attr且值包含value的元素
伪类选择器
:first-child 选中第一个元素
:last-child 选中最后一个元素
:nth-child(N)选中第 N 个元素
:nth-last-child(N) 选中倒数第 N 个元素
伪类选择器
:before
:after
.clearfix:after{
content:"";
display:block;
height:0;
clear:both;
visibility:hidden;
}
:before和:after主要用来清除浮动元素
另一种清除浮动的方法是 clear=both 用到这个属性最好是写行内样式 用法就是 在要清除浮动的元素最后添加一个空标签 在这个空标签中写一个行内样式 style="clear:both"
边框圆角
border-radius: 1px 1px 1px 1px 1px 1px 1px 1px
前四个是X轴的半径 后四个是Y轴的半径
语义化标签
头部 <header></header>
导航<nav><nav>
主体<section></section>
侧边栏<aside></aside>
内容区域<article></article>
底部区域 <footer></footer>
遇到没见过的标签不要惊讶: 和div类似只是名字不同而已 (应该是语义化标签)
以上标签在 IE9一下会有兼容问题(会解析成行内元素)
解决办法: 使用 html5shiv.js 来处理不兼容的标签 下载地址 https://github.com/aFarkas/html5shiv
使用方法:(记住 必须在头部引入)
// 只有在IE低版本浏览器才不兼容，只有在IE低版本浏览器才需要去加载这个插件
// 条件注释
<!--[if lt IE 9]>
<script src="html5shiv.min.js"></script>
<![endif]-->
<!--[if lte IE 8]>任何东西都可以 内容、标签都可以<![endif]-->
<!--10. 当满足条件的时候 注释内的内容才会去执行-->
<!--11. lte 小于等于 gte 大于等于 lt 小于 gt 大于-->
navigator.userAgent 可以查看当前使用的浏览器
表单元素类型
| 值 | 描述 |
|---|
| button |
定义可点击的按钮（通常与 JavaScript 一起使用来启动脚本）。 |
| checkbox |
定义复选框。 |
| colorNew |
定义拾色器。 |
| dateNew |
定义 date 控件（包括年、月、日，不包括时间）。 |
| datetimeNew |
定义 date 和 time 控件（包括年、月、日、时、分、秒、几分之一秒，基于 UTC 时区）。 |
| datetime-localNew |
定义 date 和 time 控件（包括年、月、日、时、分、秒、几分之一秒，不带时区）。 |
| emailNew |
定义用于 e-mail 地址的字段。 |
| file |
定义文件选择字段和 "浏览..." 按钮，供文件上传。 |
| hidden |
定义隐藏输入字段。 |
| image |
定义图像作为提交按钮。 |
| monthNew |
定义 month 和 year 控件（不带时区）。 |
| numberNew |
定义用于输入数字的字段。 |
| password |
定义密码字段（字段中的字符会被遮蔽）。 |
| radio |
定义单选按钮。 |
| rangeNew |
定义用于精确值不重要的输入数字的控件（比如 slider 控件）。 |
| reset |
定义重置按钮（重置所有的表单值为默认值）。 |
| searchNew |
定义用于输入搜索字符串的文本字段。 |
| submit |
定义提交按钮。 |
| telNew |
定义用于输入电话号码的字段。 |
| text |
默认。定义一个单行的文本字段（默认宽度为 20 个字符）。 |
| timeNew |
定义用于输入时间的控件（不带时区）。 |
| urlNew |
定义用于输入 URL 的字段。 |
| weekNew |
定义 week 和 year 控件（不带时区）。 |
表单属性:
当你有name属性 浏览器会记录你之前的提交 当你再次输入的时候,会自动给你弹出提示(自动填充功能)
表单元素的属性-->
autocomplete 设置是否使用自动填充功能 off on 针对当前表单元素
required 必须属性 加上必填项 不加不去校验
表单的属性
autocomplete 设置是否使用自动填充功能 off on 针对当前整个表单
novalidate 是否去进行整个表单的校验
普通表单和密码表单的属性:
name: 设置当前控件的名称
value：设置当前控件的默认值
placeholder： 占位符[虚隐文字]【当前控件的一个提示信息】
id: 设置当前控件唯一标识的属性【身份证】
readonly： 设置当前控件为只读模式【当前控件只能看一看，不能输入】
disabled： 设置当前控件不能输入
maxlength： 设置当前控件最多能输入多少个字符
autofocus: 自动获取焦点
提交表单:<input type="submit" name="btn">
属性: action： 用来指定当前表单控件中的数据要交给哪个后台文件去处理
method： 用来指定一种数据提交方式 method： get | post
get: 这种方式提交数据的时候，会将数据在地址栏中显示【安全性差】
post: 这种方式提交数据的时候，数据会以后台的形式提交给文件【安全】
单选控件: <input type="radio">
属性: checked： 设置当前控件默认选中
注意：
默认单选控件不能实现单选效果
只要给单选空件设置相同的name值即可。\
多选控件: <input type="checkbox" checked>
多选控件中设置默认选中项的属性与单选控件一样
视差滚动
4
H5C3
原文：https://www.cnblogs.com/maxiag/p/11182739.html
