CSS中的透明背景颜色来自十六进制RGB值
背景：我必须使用提供一些集成SASS功能的CMS来工作：用户可以定义颜色，它们以变量中的十六进制值的形式提供给我可以编辑的SCSS文件。
问题：我必须使用这种颜色的较亮版本作为div的背景。 （在某种透明度的背景颜色意义上较轻）。
通常我会这样做
background-color: rgba(r,g,b,a) ;
但是如果我没有单一的红色/蓝色/绿色值，但只有组合的十六进制RGB值，可以做些什么？
应该达到的结果的例子：
/* user color comes as a variable containing a hex value
variable: $color
example value: 00d;
*/
h1{
background-color: #00d; /* $color resolves to 00d */
}
p{
background-color: #7e7eed; /* <- this value should be calculated from the variable $color, in this case #00d + opacity 50% */
}<h1>Title</h1>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>使用减轻SASS功能
lighten($color, 20%)
如果你想改变颜色的阿尔法，使用rgba函数
rgba($color,0.8)
看演示
修改你的CSS的“不透明度”CSS属性。 0值是完全透明的，1值是完全不透明的，0.5值是半透明的等等。较小的不透明度值将使您的颜色“更轻”。 介于0和1之间的任何值都可以工作。 这与你的rgba（a == alpha）中的alpha值基本相同。
ref：http://www.w3schools.com/css/css_image_transparency.asp
链接地址: http://www.djcxy.com/p/87543.html