CSS에서 불규칙한 모양의 PNG 이미지에 대한 그림자를 어떻게 만들 수 있습니까?

CSS에서 비정사각형 PNG 이미지에 그림자 만들기

불규칙한 모양의 PNG 이미지에 그림자를 적용하는 것은 전통적인 상자 그림자 속성을 사용하는 도전. 이미지 모양에 맞는 적절한 그림자를 얻으려면 필터: dropShadow() 속성을 활용할 수 있습니다.

CSS 솔루션:

img {
  -webkit-filter: drop-shadow(5px 5px 5px #222);
  filter: drop-shadow(5px 5px 5px #222);
}

인라인 솔루션:

<img  src="/static/imghwm/default1.png" data-src="image.png" class="lazy" alt="CSS에서 불규칙한 모양의 PNG 이미지에 대한 그림자를 어떻게 만들 수 있습니까?" >

dropShadow() 속성은 여러 매개변수를 사용합니다:

• x 및 y: 이미지에서 그림자까지의 거리(픽셀 단위)
• blur(선택 사항): 픽셀 단위의 그림자의 흐릿함
• 색상: 색상 그림자

필터 속성을 drop-shadow()로 설정하면 브라우저는 이미지 주위에 모양을 따르는 그림자를 생성하여 원하는 효과를 제공합니다.

위 내용은 CSS에서 불규칙한 모양의 PNG 이미지에 대한 그림자를 어떻게 만들 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!