728x90
반응형
질문 : CSS 배경 불투명도
다음 코드와 비슷한 것을 사용하고 있습니다.
<div style="opacity:0.4; background-image:url(...);"> <div style="opacity:1.0;"> Text </div> </div> 배경의 불투명도가 0.4이고 텍스트의 불투명도가 100 %가 될 것으로 예상했습니다. 대신 둘 다 불투명도가 0.4입니다.
답변
아이들은 불투명도를 상속받습니다. 그렇지 않으면 이상하고 불편할 것입니다.
배경 이미지에 반투명 PNG 파일을 사용하거나 배경 색상에 RGBa (알파) 색상을 사용할 수 있습니다.
예, 50 % 희미한 검정색 배경 :
<div style="background-color:rgba(0, 0, 0, 0.5);"> <div> Text added. </div> </div>출처 : https://stackoverflow.com/questions/10422949/css-background-opacity
728x90
반응형
'프로그래밍 언어 > HTML,CSS,JS' 카테고리의 다른 글
| HTML5에 minlength 유효성 검사 속성 (0) | 2021.06.04 |
|---|---|
| CSS 클래스가 하나 이상의 다른 클래스를 상속하는 방법 (0) | 2021.06.04 |
| 인라인 CSS에서 a : hover를 작성하는 방법 (0) | 2021.06.03 |
| Node.JS를 사용하여 JSON 파일을 (서버) 메모리로 읽는 방법 (0) | 2021.06.03 |
| HTML로 표시하기 위해 위쪽 / 아래쪽 삼각형 (줄기없는 화살표)에 사용할 수있는 문자 (0) | 2021.06.02 |