字体图标、语义化标签、css3滤镜、html5的音频和视频标签、css3渐变

字体图标

1、语法：

@font-face {font-family : "sha" ;   src: url(  .ttf) ; }
div { font-family :  "sha"  ;  }

2、滚动条样式的设置 overflow : auto ;
-webkit-scrollbar : 轨道样式
-webkit-scrollbar-thumb： 小方块
-webkit-scrollbar-buttor：箭头
3、输入框提示信息的样式设置

 input:: -webkit-input-placeholder{}
 input{outline: 1px solid red ;}（outline是修饰线，与border使用相同，常用none，在边框外面，不会撑大盒子）

语义化标签

<header>：页眉包括网站标志，主导航，全站链接以及搜索框
<nav>：标记导航，仅对文档中重要的链接群使用，有<li>
<main>：页面主要内容，一个页面只能使用一次
<article>：定义外部的内容
<section>：定义文档中的节（章节，页眉，页脚）
<aside>：定义其所处内容之外的（侧栏，广告，友情链接，相关产品列表，文章的一组链接）
<footer>：页脚，只有当父级是body时，才是整个页面的页脚

css3滤镜

filter: 属性值 ；

		属性值             效果
		blur()            单位是自然数，模糊处理，值越大，越模糊，默认为0
		brightness ()     图片亮度，单位是百分数，默认为100%
		contrast ()       灰度，值越小，越灰（对比度）

html5的音频和视频标签(放在body)

1、语法：<audio src=" " controls=" " (必须属性)> </audio> <audio controls> <source src=" "> </audio>
2、video src=" " controls //必须属性
3、audio和video元素的常用属性

属性           值               效果
autoplay   true/false          设置或返回音频、视频是否在加载后立即播放
controls   controls            指定是否为音频、视频添加浏览器自带的播放控制条,必须属性
loop       loop                指定是否循环播放，默认为不循环
src        url                 地址，必须属性
preload    none/metadata/auto  表示是否进行预加载（none:不加载。metadata:只加载媒体的元素据。auto:全部音视频）
muted     true/false          true:表示自动播放
width/height  像素            video的独有属性，指定视频的宽度和高度

css3渐变（gradients）

有两个或多个指定的颜色之间显示平稳的过渡，使用background-image来设置渐变属性

类型：

1、线性渐变（linear gradients）

1、至少定义两个颜色节点，默认为自上向下，方向可以为：向下/向上/向左/向右/对角方向。
2、语法：background-image: linear-gradient（color1,color2）
改变方向：background-image: linear-gradient（to left,color1,color2）
斜对角：to bottom right / to right top
角度控制：deg
占比控制：（to left,color1 20%,color2 80%）百分数不能持平
重复：repeating-linear-gradient:

2、径向（radial gradients）：

1、由它们的中心定义，中心是center，正方形不能中心为椭圆，长方形都可
2、语法：（circle(正圆)/ellipse(椭圆),color1,color2）
方向控制：ellipse at bottom