<>CSS Set background color transparent
Set the background color to transparent , Two methods :
Method 1 : adopt background-color and opacity To set
opacity The opacity of attribute parameters is expressed in numbers , from 0.0 reach 1.0, Completely transparent yes 0.0, Completely opaque yes 1.0, The larger the number, the more opaque the element is .
<div class="box01"> <p> Today is Wednesday </p> </div> <div class="box02"> <p> Compare with the box above </p> </
div> <style> .box01 { width: 200px; height: 200px; background-color: brown;
opacity: 0.3; } .box02 { width: 200px; height: 200px; background-color: brown; }
</style>
effect :
If there is text in the box , The text will become transparent with the background color .
Method 2 : adopt rgba Method to set the background color transparent
rgba colour , namely RGB Tricolor plus ALPHA, While adding color to the background , Provide transparency properties .
usage :background: rgba(R, G, B, A);
<div class="box01"> <p> Today is Wednesday </p> </div> <div class="box02"> <p> Compare with the box above </p> </
div> <style> .box01 { width: 200px; height: 200px; background-color: rgba(165,
42, 42, 0.3); } .box02 { width: 200px; height: 200px; background-color: brown; }
</style>
effect :
Use in combination with specific conditions .
Technology
Daily Recommendation