1 box-shadow属性与text-shadow（IE9+）
box-shadow属性能使框添加一个或多个阴影，格式为：
box-shadow: h-shadow v-shadow [blur spread color inset];其中：
- h-shadow：必选，表示水平方向阴影的位置，可以为负值；
- v-shadow：必选，表示垂直方向阴影的位置。可以为负值；
- blur：可选，表示模糊度；
- spread：可选，阴影的大小尺寸；
- color：可选，颜色；
- inset：可选，用于改写成内阴影，默认值是
outset，可以改写成inset
box-shadow: 10px 10px 10px 10px black inset;text-shadow属性向文本添加一个或多个阴影，格式为：
text-shadow:h-shadow v-shadow blur color;定义按钮凹下去的效果，可以这样定义
.active { box-shadow: inset 0 1px 3px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.1);//定义内外阴影 text-shadow: 0 1px 0 rgba(0,0,0,.1); }
2 opacity属性与rgba属性
2.1 opacity属性
opacity属性用于定义透明度，取值范围为0~1，其定义的透明度会直接影响其子元素，对于IE8及之前的浏览器只能使用：filter:Alpha(opacity=50) 这个filter 属性替代
2.2 rgba属性（IE9）
rgba属性类似于rgb属性用于表达颜色，区别在于rgba还多一个参数用于表示透明度。该透明度取值范围为0~1。
与opacity不同的是，子元素不会被其影响，例：
background-color:rgba(255,255,255,0.1);3 线性渐变颜色linear-gradient属性（IE10+）
具体看这里
background属性使用linear-gradient属性值可以达到线性渐变颜色的效果 linear-gradient自身的语法是：
linear-gradient(angle,color-top length || percentage,color length || percentage)其中：
-
angle表示渐变线的方向，关键字值有to left，to right，to top，以及默认值to bottom，另外还可以使用角度如270deg -
color-top：指定初始颜色 -
color：结尾颜色 -
length或percentage：定义止色位置
实例如：
body { background:linear-gradient(#191c20 0%, #24292e 15%) ; }3 关于检测用户缩放浏览器
在编写固定定位的时候，当缩放浏览器并进行滚动页面时，有时会想要取消掉固定定位，这时可以使用上jQueryresize()事件以及scroll事件。
3.1 resize()事件与scroll()事件
3.1.1
注：CSS中的
resize属性可用于允许用户调节元素的尺寸大小， 数值有none(默认值)，both(高和宽都可调控)，horizontal(可调宽)，vertical(可调高)。
常常用设置浏览器默认的textarea标签，使之不可大小不由用户调控。
Firefox 4+、Safari 以及 Chrome 支持 resize 属性。
JavaScript的onresize()事件对应jQuery的就是resize()事件，当浏览器窗口大小被调整时就会触发事件函数。一般来说，resize事件函数都会绑定在$(window)对象（JavaScript的是window对象或body标签）中。
3.1.2 scroll()事件
JavaScript的onscroll()事件对应jQuery的就是scroll()事件，当浏览器滚动条被滚动时就会触发事件函数。一般来说，scroll事件函数都会绑定在$(window)对象（JavaScript的是window对象或body标签）中。
有了事件函数的支持，通过一些元素的属性比较，可以决定响应的动作。
3.2 scrollLeft()方法，scrollTop()方法，offset().top属性以及offset().left属性
这些方法属性都是对应jQuery对象的方法属性，使用
$(window).width()以及$(window).height()方法可以返回浏览器可视窗口的宽度以及长度
3.2.1 scrollLeft()方法，scrollTop()方法
scrollLeft()，scrollTop()方法是一个用于返回或设置浏览器滚动页面，滚动了的距离，一般来说都是绑定$(window)对象。
使用
scrollLeft()以及scrollTop()实质是调用window.pageXOffset以及window.pageYOffset（这两个属性都不兼容IE8，IE8使用的是document.documentElement.scrollLeft以及document.documentElement.scrollTop）
3.2.2 offset()方法，offset().top属性以及offset().left属性
offset()方法用于返回或设置匹配元素相对于文档的偏移（位置），如果要设置位置，则需要导入一个含top以及left键值对的对象作为参数，所以同理offset().top属性可以返回匹配元素的偏移纵坐标，offset().left属性返回匹配元素的偏移横坐标。
通过绑定
scroll()和resize()事件函数，比较offset().top与scrollTop()或offset().left与scrollLeft()的对应值，就可以编写出对应的响应动作。
注意：使用animate()方法调整滚动距离时，其作用对象是$('html,body')而不是$(window)