CSS3属性学习--2.RGBA_html/css

来源：动视网责编：小采时间：2020-11-27 16:03:19

CSS3属性学习--2.RGBA_html/css

CSS3属性学习--2.RGBA_html/css_WEB-ITnose:RGBA 是 CSS3 中用来控制颜色的单位，分别是 Red Green Blue 三原色和 Alpha 透明度的缩写。也就是说该属性可以帮助我们在设置颜色的同时，也设置了其透明度。其实就是 RGB 属性和 opacity 属性的合并写法。其中 RGB 三个值的设置可以为百分比或者

推荐度：

点击下载本文 文档为doc格式

导读CSS3属性学习--2.RGBA_html/css_WEB-ITnose:RGBA 是 CSS3 中用来控制颜色的单位，分别是 Red Green Blue 三原色和 Alpha 透明度的缩写。也就是说该属性可以帮助我们在设置颜色的同时，也设置了其透明度。其实就是 RGB 属性和 opacity 属性的合并写法。其中 RGB 三个值的设置可以为百分比或者

RGBA 是 CSS3 中用来控制颜色的单位，分别是 Red Green Blue 三原色和 Alpha 透明度的缩写。

也就是说该属性可以帮助我们在设置颜色的同时，也设置了其透明度。

其实就是 RGB 属性和 opacity 属性的合并写法。

其中 RGB 三个值的设置可以为百分比或者 0~255 的整数值。

A 的值则是 0~1 ，和 opacity 属性一致。

一、应用在背景中：

.reg-bgc{ background: rgb(255, 0, 0);}.apl-bgc{ background: rgba(255, 0, 0, 0.5);}

2. 边框

.reg-border-color{ border-width:3px; border-style: solid; border-color: rgb(255, 0, 0);;}.apl-border-color{ border-width:3px; border-style: solid; border-color: rgba(255, 0, 0, 0.5);;}

3. 字体

.reg-font-color{ color:rgb(255, 0, 0);;}.apl-font-color{ color:rgba(255, 0, 0, 0.5);;}

4. 字体阴影

.reg-textshad-color{ text-shadow: 0 2px 1px rgb(255,0,0);;}.apl-textshad-color{ text-shadow: 0 2px 1px rgba(255,0,0,0.5);;}

5. box 阴影

.reg-boxshad-color{ box-shadow: 0 5px 5px rgb(255,0,0); -webkit-box-shadow: 0 5px 5px rgb(255,0,0); -moz-box-shadow: 0 5px 5px rgb(255,0,0);}.apl-boxshad-color{ box-shadow: 0 5px 5px rgba(255,0,0,.5); -webkit-box-shadow: 0 5px 5px rgba(255,0,0,.5); -moz-box-shadow: 0 5px 5px rgba(255,0,0,.5);}

demo

CSS3属性学习--2.RGBA_html/css

推荐度：

点击下载本文 文档为doc格式

标签：学习 html 属性

热门焦点

CSS3属性学习--2.RGBA_html/css

CSS3属性学习--2.RGBA_html/css

CSS3属性学习--2.RGBA_html/css

最新推荐

猜你喜欢

热门推荐