opacity 和 rgba的区别

1.opacity 和 rgba的区别：

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4   <style>
 5     #box1 {
 6       width: 200px;
 7       height: 200px;
 8       background-color: red;
 9     }
10     #box2 {
11       width: 100px;
12       height: 100px;
13       background-color: yellow;
14       opacity: .2;
15     }
16     #box3 {
17       width: 100px;
18       height: 100px;
19       background-color: rgba(000,000, 000, 0.2);
20     }
21   </style>
22 </head>
23 <body>
24   <div id="box1">
25     <div id="box2">box2</div>
26     <div id="box3">box3</div>
27   </div>
28 </body>
29 </html>
View Code

总结：opacity会同时影响字体的透明度

posted @ 2021-04-10 22:05  星空的轨迹  阅读(105)  评论(0)  编辑  收藏  举报