透明永远是一个幻想，它经常被用在网页制作中。合理使用透明度可以给我们带来鱼一样的视觉体验。当然还有很多复杂的技术，更多的浏览器兼容问题。
一般我们不为元素设置任何样式，所以这个元素的背景和边框是透明的，也就是不设置，显示默认属性。浏览器会自动为这些元素的背景和边框属性添加透明属性值。
但是，有些浏览器在处理这个默认值时会略有不同。比如Google浏览器会自动添加rgba，表示Alpha通道为0，所以可以理解为透明属性值和rgba基本等价。
有两种方法可以设置CSS中元素的透明度，Alpha通道和Opacity属性。
阿尔法通道
Alpha通道是我们经常使用的rgba颜色。它给原始的rgb增加了一个透明度，只对可以设置颜色的CSS属性有效。您可以单独设置CSS属性。
p {宽度:100px高度:100px背景:rgba边框:1px solid # 000000}
不透明度
不透明度设置整个元素的透明度，值为0-1，支持小数。
p {宽度:100px高度:100px背景:# 000000；边框:1px solid # 000000不透明度:0.5；}
工业工程的透明度
IE9+刚开始支持CSS3不透明，而IE6-IE8习惯使用filter属性来实现。IE4-IE9都支持过滤器编写progid:dximagetransform . Microsoft . alpha。
E8推出了一种特殊的质谱过滤器。IE认为这种写法是对旧写法的修正，更符合规范。这种写法的属性值只是一对引号，效果和以前一样。但是这种写法的寿命并不长，IE10已经不再支持filter和-ms-filter了。
-ms-filter:" progid:DXImageTransform。Microsoft . Alpha "；//第一个过滤器:alpha//秒
如果要同时使用filter和-ms-filter，请在filter前面写上-ms-filter。
注意:测试中不要忘记写DOCTYPE，否则会偏离真实效果。
摘要为了透明，我们至少要写4行代码，这也是为了兼容性。随着浏览器版本的更新，我们将在后期获得更兼容的编写，节省我们的开发时间。
我们发现，在使用alpha通道设置透明度时，我们需要分别设置每一个，而不透明度则直接应用于整个标签。其实这是两者最大的区别。综上所述，opacity只能设置整个元素的透明度值，而alpha通道可以为元素的某个属性设置透明度值，比如上面的背景、边框、文字。
