CSS에서 불투명도 속성을 사용하여 배경 이미지에 투명도를 추가하는 방법(코드)

이 문서의 내용은 CSS에서 배경 이미지에 투명도(코드)를 추가하는 방법에 대한 내용입니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

CSS의 배경 이미지에 불투명도 속성을 직접 추가할 수 없습니다. 다음 방법을 사용하여 이 제한을 우회할 수 있습니다.

div {
  width: 200px;  
  height: 200px;  
  display: block;  
  position: relative;
  }
div::after {
  content: "";  
  background: url(image.jpg);  
  opacity: 0.5;  
  top: 0;  
  left: 0;  
  bottom: 0;  
  right: 0;  
  position: absolute;  
  z-index: -1;   
}

관련 권장 사항:

CSS 투명 불투명도 및 IE 버전의 투명도 필터를 가장 정확하게 사용하는 방법 filter

CSS3의 불투명도 속성을 사용하여 투명 효과를 설정하는 방법 소개

위 내용은 CSS에서 불투명도 속성을 사용하여 배경 이미지에 투명도를 추가하는 방법(코드)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!