颜色的表示方式

1、用颜色名表示  

例：red,yellow...

transparent表示透明色

优点：简单

缺点：能表示的颜色数量有限

/*示例*/
div {
    width:200px;
    height:100px;
    background:red;
}

2、用六位十六进制表示颜色

#000000

取值范围：0~f（三原色混合原理  红色，绿色，蓝色）

前两位表示红光，中间两位表示绿光，最后两位表示蓝光

如果前两位一样，中间两位一样，最后两位一样，即两位数前后相同的情况下，则可以用三位六进制表示，例如：#000

/*示例*/
div {
    width:200px;
    height:100px;
    background:#ffffff;
}

 3、rgb表示方法

rgb(red,green,blue)  三原色混合原理，取值范围0~255

/*示例*/
div {
    width:200px;
    height:100px;
    background:rgb(240,68,68);
}

4、rgba表示方法

rgba(red,green,blue,alpha)   三原色混合原理，取值范围0~255

alpha表示透明度（取值范围：0~1），只针对制定颜色设置透明度

补充：背景颜色透明opactity(取值范围：0~1)，对整个html元素设置透明度

/*示例*/
div {
    width:200px;
    height:100px;
    background:rgba(1,199,188,0.4);
}

5、颜色渐变

linear-gradient(方向,颜色,颜色,...)     如果想更多颜色渐变可以继续往后加

/*示例*/
div {
    width:200px;
    height:100px;
    background:linear-gradient(30deg,red,pink);
}

deg是角度单位，0deg代表12点方向，角度值代表顺时针转过的角度

0deg表示从下到上渐变，90deg表示从左往右渐变，180deg表示从上往下渐变，270deg表示从右往左渐变

注：透明色transparent也可以参与渐变