이 예에서는 하위 요소의 불투명도를 변경하지 않고 상위 요소를 더 투명하게 만들려고 합니다.
으아악현재 내 CSS 스타일은 다음과 같습니다.
으아악CSS에서 이 효과를 얻을 수 있나요?
P粉3156805652023-09-10 13:20:59
자녀는 항상 부모의 불투명도에 영향을 받으므로 서로 다른 불투명도를 부여하는 가장 쉬운 방법은 형제 요소를 만들고 두 번째 요소를 첫 번째 요소 위에 절대적으로 배치하여 각 요소에 고유한 불투명도를 부여하는 것입니다. 상위 래핑 div의 상대 위치를 참고하세요.
여기에는 마치 하위 요소인 것처럼 빨간색 div 뒤에 녹색 div가 있는 일부 텍스트가 표시되어 있지만 실제로는 형제 요소이므로 빨간색 div의 불투명도에 영향을 받지 않습니다. 따라서 텍스트는 빨간색 div를 통해 표시되지만 녹색 div는 표시되지 않습니다.