Đặt hiệu ứng bóng đổ bằng CSS

Drop Shadow được sử dụng để tạo bóng cho đối tượng của bạn ở độ lệch và màu được chỉ định X (ngang) và Y (dọc).

Các thông số sau có thể được sử dụng trong bộ lọc này:

Tham số	Mô tả
color	Màu của giọt bóng, ở định dạng #RRGGBB.
offX	Số pixel mà bóng đổ bị lệch khỏi đối tượng trực quan, dọc theo trục x. Số nguyên dương di chuyển bóng đổ sang phải, số nguyên âm di chuyển bóng đổ sang trái.
tắtY	Số pixel mà bóng đổ bị lệch khỏi đối tượng trực quan, dọc theo trục y. Các số nguyên dương di chuyển bóng đổ xuống dưới, các số nguyên âm di chuyển bóng đổ lên trên.
tích cực	Nếu đúng, tất cả các pixel mờ của đối tượng đều có bóng đổ. Nếu sai, tất cả các pixel trong suốt có bóng đổ. Mặc định là đúng.

Ví dụ

Bạn có thể thử chạy đoạn mã sau để đặt hiệu ứng đổ bóng:

<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>