728x90
반응형
rgba는 opacity 속성과는 달리 배경색만 투명하게 변경할 수 있습니다.
IE8 이하의 브라우저에서 지원하지 않으므로, 크로스 브라우징을 위해 아래와 같이 별도로 투명도를 지정해야 합니다.
background: transparent;
background-color: rgba(255, 255, 255, 0.5);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00ffffff,endColorstr=#00ffffff)"; /* IE8 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00ffffff,endColorstr=#00ffffff); /* IE6~7 */
zoom: 1;
background-color: rgba(255, 255, 255, 0.5); 의 0.5는 opacity(투명도) 값으로, 0에 가까울수록 투명해지며 1에 가까울수록 불투명해집니다.
(startColorstr=#00ffffff,endColorstr=#00ffffff) filter의 00자리에도 역시 투명도 값이 들어가는데, 여기에 들어갈 16진수 값은 아래와 같습니다.
| 0.0 | 0.1 | 0.2 | 0.3 | 0.4 | 0.5 | 0.6 | 0.7 | 0.8 | 0.9 | 1.0 |
| 00 | 1a | 33 | 4d | 66 | 80 | 99 | b3 | cc | e6 | ff |
728x90
