CSS3学习笔记（三）——颜色

1、alpha透明度参数

body{
    background-color:rgba(255,255,255,0.5);/*rgba(R,G,B,A)*/
}

2、渐变色彩   Gradient：

               线性渐变(linear):向下/向上/向左/向右/对角方向

               径向渐变(radial):由它们的中心定义

线性渐变：默认从上到下

语法：至少定义两种颜色结点

background: linear-gradient(direction, color-stop1, color-stop2, ...);

例子： 

body{
    background:linear-gradient(red,blue);
    background:-webkit-linear-gradient(red,blue);
    background:-moz-linear-gradient(red,blue);
    background:-ms-linear-gradient(red,blue);
    background:-o-linear-gradient(red,blue);
}
#grad{
      background:-webkit-linear-gradient(left,red,blue);
}
#grad1{
      background:-webkit-linear-gradient(right,red,blue);
}
#grad2{
      background:-webkit-linear-gradient(right top,red,blue);
}
#grad3{
      background:-webkit-linear-gradient(bottom right,red,blue);
}

   径向渐变：

   语法：角度是指水平线和渐变线之间的角度，逆时针方向计算

background: linear-gradient(angle, color-stop1, color-stop2);

 

笔记整理出自：https://www.imooc.com/learn/33