|
H5C3 html5的新特性 增加了一些新的标签、新的表单和新的表单属性等等，一般只支持IE9以上版本的浏览器，如果我们不去考虑兼容性问题， mdn查看浏览器兼容性 htlm5新增的input类型 type=“email” 限制输入email格式 type=“URL” 限制输入地址 type=“submit”提交表单 type=“date” 输入日期 type="month"输入月份 type="week"输入周 type="number"输入数字 type="search"搜索框 type="color" 生成调色盘 type="password"密码输入框 type=”time“输入时间 html5表单的新增属性 input里的placeholder属性是 表单备注 （value和placeholder同时存在，显示value值） input type=“file” multiple=“multiple 上传多的文件 input type=“text” required=“required” 提交表单不能为空 impute type=“text” autofocus=“ autofocus” 让光标自动聚焦到当前当前表单元素内 input type=“text” autocomplete="no/off" name=“1“ on自动记录输入内容 ，off取消自动记录 ，必须加上name属性才能生效。 html5新增的多媒体标签 video标签 H5可以在不使用插件的情况下，可以使用原生的标签来支持视频格式文件的播放。 属性 controls=“controls” 播放控件 autoplay ="autoplay" muted="muted"自动静音播放 loop=“loop”循环播放 poster=“路径” 视频加载时的等待图像 preload=" auto" 预加载（如果有autoplay忽略该属性） preload="none" 无预加载 <source src="" type="video/mp4"></source>资源标签 audio标签 循环播放<audio src="" controls="controls"loop="loop"></audio> CSS3 CSS3怪异盒模型 通过box-sizing还指定盒子模型 box-sizing：content-box 盒子大小默认的width+height+padding+margin box-sizing：border-box 大小只指定宽高 新增的选择器 属性选择器 例如选择还有value的input的标签 input[value]{} 例如选择还有type属性的值等于search的input标签 input[type="search"]{} 例如选择具有type属性的值以t开头的input标签 input[type^="t"]{} 例如选择具有type类型的值以出结尾的input标签 input[type$="ch"]{} 例如选择具有type类型的值包含e的input标签 input[type*="e"] 结构伪类选择器 结构伪类选择器主要是根据文档结构来选择元素的 ：nth-child(2n) :nth-child(even) 选择偶数标签 ：nth-child（2n-1） :nth-child(odd) 选择基数标签 :nth-child(n) 全选标签 ：first-child 第一个标签 ：last-child 最后一个标签 ：first-of-type 第一个标签 ：last-of-type 最后一个标签 ：nth-of-type（n） 第n个标签 伪元素选择器 概念 伪元素选择器可以帮助我们利用css创建新的标签元素，而不需要html标签，从而简化html的结构 注意点 before和after都可以床架一个元素，这个元素属于行内元素 新创建的元素在html结构里找不到的，所以称之为伪元素 CSS的过渡 CSS3里在不使用flash动画或者js的情况，将元素从一种状态变化为另一种状态的实现 属性值名 transition 属性值： 想要变化的属性 宽高内外边距，如果所有属性都要变化写一个all 花费时间 单位必须是秒 运动曲线 默认值ease可省略； linear 运输业 ease 逐渐变慢 ease-in 加速 ease-out 减速 ease-in-out先加速后减速 何时开始 单位必须是秒，可以设置延时触发时间
| 
