背景颜色| 学习笔记

开发者学堂课程【零基础学前端 HTML+CSS ：背景颜色】学习笔记，与课程紧密联系，让用户快速学习知识。

课程地址：https://developer.aliyun.com/learning/course/398/detail/5147

背景颜色

内容介绍

一、背景颜色介绍

二、CSS 背景颜色介绍及示例操作

一、背景颜色介绍

1.颜色

十六进制色 bacikground-color:#0000ff; //十六进制的值

RGB 颜色：rgb(255,0,0);  //红绿蓝三种颜色

RGBA 颜色：_{rgba(255,0,0,0.5);}  //增加的属性

HSL 颜色：hsl(120,65%,75%);

HSLA 颜色：hsla(120,65%,75%，0.3);

RGBA 颜色值得到一下浏览器支持：IE9,Firefox3+,Chrome、Safari以及Opera 10+

RGBA 颜色值是 RGB 颜色值的扩展，带有一个 alpha 通道-它规定了对象的不透明度

RGBA 颜色值规定：rgba(red,green,blue,alpha) alpha 参数是介于0.0（完全透明）与1.0（完全不透明）的数字。

新增加的 RGBA 颜色设置，可以增加一个 alpha 通道，数值是0-1,0代表透明，1代表不透明。

二、CSS 背景颜色介绍及示例操作

示例代码:

#color{

width:500px;

height:500px;

background-color:rgb(255,0,0);

} 

#color2{

width:500px;

height:500px;

background-color:rgb(255,0,0.5);

}

<div id=”color”>

</div>

呈现效果如下：

//会出现透明的图像，是 RGBA 的通道的作用，可以根据效果去制定，比如设置一个图层