04.CSS3样式

十一. css3样式

11.1 渐变

/** 
	linear-gradient() 第一个值为到哪个方位：top top, to bottom, to left, to right
		第二个值为起始颜色，
		第三个值为最终的颜色 
 */
background: linear-grediant(to top, #ffffff, red);

11.2 阴影

/**
	第一个值为x轴方向的阴影
	第一个值为y轴方向的阴影
	第三个值为模糊程度
*/
box-shadow: 5px 5px 10px #51b7ec;

11.3 状态改变

transform属性常用的有三个: translate、rotate、scale

translate

 transform: translate(10px,5px);  /** 水平方向向下移动10px，垂直方向向上移动5px */

rotate

transform: rotate(30deg);  /** 垂直方向选装30deg */

scale

transform: scale(1.2);  /** 将盒子整体放大1.2倍 */