CSS3学习系列之颜色
生活随笔
收集整理的这篇文章主要介绍了
CSS3学习系列之颜色
小编觉得挺不错的,现在分享给大家,帮大家做个参考.
（1）RGBA
RGBA是一种色彩标准，是由红（R）、绿（G）、蓝（B）的变化以及互相叠加来得到各式各样的颜色，RGBA是在RGB的基础上增加了alpha透明度的参数
语法：
color:rgba(R,G,B,A)，以上R,G,B三个参数，正整数的取值范围为0-255，百分数值的取值范围为0-100%，超过范围的数值将被截至其最接近的取值极限，并非所有的浏览器都支持使用百分数值，A为透明度参数，取值在0-1之间，不可为负值。
实例
background-color:rgba(100,120,60,0.5);
（2）渐变色彩
CSS3 Gradient 分为线性渐变（linear）和径向渐变（radial）.由于不同的渲染引擎实现渐变的语法不同。
语法：
参数：第一个参数：指定渐变方向，可以用“角度”的关键词或“英文”来表示：
第一个参数省略时，默认为180deg,等于“to bottom”
第二个参数和第三个参数，表示颜色的起始点和结束点，可以有多个颜色值。
角度的话记住后面的就行。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>RGBA colors</title> <style type="text/css"> body{background:url(http://static.mukewang.com/static/img/logo_index.png)} p{font-size:42px;text-align:center;font-weight:bold;background:rgba(255,255,255,0.5); } span{width: 400px;height: 150px;line-height: 150px;text-align:center;color: #000;font-size:24px;background-image:linear-gradient(to top left,red, orange,yellow,green,blue,indigo,violet); } </style> </head> <body> <p>背景半透明的？</p><span>右下角向左上角的线性渐变背景</span> </body> </html>
转载于:https://www.cnblogs.com/Gabby/p/5378808.html
总结
以上是生活随笔为你收集整理的CSS3学习系列之颜色的全部内容，希望文章能够帮你解决所遇到的问题。
- 上一篇： MongoDB 连接数高产生原因及解决
- 下一篇： CSS样式表margin和padding