CSS를 사용하여 그림자 효과 설정-CSS 튜토리얼-php.cn

CSS를 사용하여 그림자 효과 설정

WBOY

풀어 주다： 2023-09-01 18:33:02

앞으로

1126명이 탐색했습니다.

使用 CSS 设置阴影效果

Drop Shadow는 지정된 X(가로) 및 Y(세로) 오프셋과 색상으로 개체의 그림자를 만듭니다.

이 필터에서는 다음 매개변수를 사용할 수 있습니다.

Parameters	Description
Color	Color, #RRGGBB 형식, Shade.
offX	투영이 X축을 따라 시각적 객체로부터 오프셋되는 픽셀 수입니다. 양의 정수는 투영을 오른쪽으로 이동하고, 음의 정수는 투영을 왼쪽으로 이동합니다.
offY	Y축을 따라 시각적 개체에서 그림자가 오프셋되는 픽셀 수입니다. 양의 정수는 그림자를 아래쪽으로 이동하고, 음의 정수는 그림자를 위쪽으로 이동합니다.
긍정적	true이면 개체의 모든 불투명 픽셀에 그림자가 있습니다. false인 경우 모든 투명 픽셀에 그림자가 있습니다. 기본값은 true입니다.

예

다음 코드를 실행하여 그림자 효과를 설정할 수 있습니다.

Live Demo

<html>
   <head></head>
   <body>
      <img src = "/css/images/logo.png"
         alt = "CSS Logo"
         style = "Filter: Chroma(Color = #000000)
         DropShadow(Color = #FF0000,
         OffX = 2,
         OffY = 2, Positive = 1)">
      <p>Text Example:</p>
      <div style = "width: 357;
         height: 50;
         font-size: 30pt;
         font-family: Arial Black;
         color: red;
         Filter: DropShadow(Color = #000000, OffX = 2, OffY = 2, Positive = 1)">CSS Tutorials</div>
   </body>
</html>

로그인 후 복사

위 내용은 CSS를 사용하여 그림자 효과 설정의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!