定义CSS样式时，经常出现两个或更多规则应用在同一元素上
·选择器相同，则执行层叠性
·选择器不同，就会出现优先级的问题，就会涉及CSS权重计算。
下面我们详解介绍 CSS层叠性权重计算方法。
1) 权重计算公式
关于CSS权重，我们需要一套计算公式来去计算，这个就是 CSS Specificity(特殊性)
值从左到右，左面的最大，一级大于一级，数位之间没有进制，级别之间不可超越。
·关于CSS权重，我们需要一套计算公式来去计算，这个就是 CSS Specificity(特殊性)
2) 权重叠加
我们经常用交集选择器，后代选择器等，是有多个基础选择器组合而成，那么此时，就会出现权重叠加。
就是一个简单的加法计算
div ul li ------>0,0,0,3
.nav ul li ------>0,0,1,2
a:hover -----—>0,0,1,1
.nav a ------>0,0,1,1
注意：
数位之间没有进制 比如说： 0,0,0,5 + 0,0,0,5 =0,0,0,10 而不是 0,0, 1, 0， 所以不会存在10个div能赶上一个类选择器的情况。
3) 继承的权重是0
这个不难，但是忽略很容易绕晕。其实，我们修改样式，一定要看该标签有没有被选中。
1) 如果选中了，那么以上面的公式来计权重。谁大听谁的。
2) 如果没有选中，那么权重是0，因为继承的权重为0。
前端入门Web前端HTML5+CSS3+移动Web前端全套
css是美化html的！！你说的应该是javascript！如下面代码：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script language="JavaScript">
function sum(){
var s1 = document.f1.s1.value
var s2 = document.f1.s2.value
var s3 = Number(s1)+Number(s2)
document.f1.s3.value=s3
}
</script>
</head>
<body>
<form name="f1">
<input type="text" name="s1">+
<input type="text" name="s2">=
<input type="text" name="s3">
<input type="button" value="计算结果" onclick="sum()">
</form>
</body>
</html>
CSS动画中使用的是三阶曲线，如下图所示，三阶曲线共有P0,P1,P2,P3四个节点，其中P0是起点、P3是终点，P1和P2是控制点。同时CSS中使用的曲线，有些特殊，它固定了起点P0(0,0)和终点P3(1,1)，仅有控制点可以移动。移动控制点可以改变曲线的曲率(弯曲的程度)，通过曲率的变化反映出速率的变化，应用于动画之中。之后我们来看下曲率对应速率变化的规律。X轴和Y轴，我们理解为时间轴和距离变化轴，那么单位时间内，距离变化的多少，反应出来的就是速度的快慢。
下图中，X轴的切分是均等的，同时虚线矩形内，x1对应的y1、x2对应的y2，也是相等的，那么认为起点到终点是匀速变化的。
下图中，X轴的切分是均等的，同时虚线矩形内，x1对应的y1 大于 x2对应的y2，那么认为起点到终点的运动过程中，速度是先快后慢的。
这两种曲线反应到具体的动画之中的效果如下。
CSS动画中，使用贝塞尔曲线作为值的属性有两个，transition-timing-function，animation-timing-function，格式为cubic-bezier(P1x,P1y,P2x,P2y)，实际应用中的代码实例 transition: all 3.0s cubic-bezier(0.75, 0.25, 0.25, 0.75)。
可能你大多看到的是，ease,linear,ease-in-out 这样的属性值，其实它们也是贝塞尔曲线值，只不过是官方预定义的，以简化明了的名称，替代了复杂的数值书写方式。
以下是一些预定义名称对应的曲线值：
ease: cubic-bezier(0.25, 0.1, 0.25, 1.0)
linear: cubic-bezier(0.0, 0.0, 1.0, 1.0)
ease-in: cubic-bezier(0.42, 0, 1.0, 1.0)
ease-out: cubic-bezier(0, 0, 0.58, 1.0)
ease-in-out: cubic-bezier(0.42, 0, 0.58, 1.0)
