Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> CSS

สร้างเงา Attenuated Shadow ด้วย CSS Filter


Shadow filter ใช้สร้างเงาที่ลดทอนในทิศทางและสีที่ระบุ

พารามิเตอร์ต่อไปนี้สามารถใช้ในฟิลเตอร์นี้ได้:

ลำดับพารามิเตอร์ & คำอธิบาย
1Color
สีที่คุณต้องการให้เงาเป็น
2Direction
ทิศทางของเบลอ ไปตามเข็มนาฬิกา ปัดเป็นช่วง 45 องศา ค่าเริ่มต้นคือ 270 (ซ้าย)
0 = บน
45 = ขวาบน
90 = ขวา
135 = ล่างขวา
180 = ล่าง
225 = ล่างซ้าย
270 = ซ้าย
315 = บนซ้าย

ตัวอย่าง

ลองรันโค้ดต่อไปนี้เพื่อนำ shadow filter ไปใช้:

<html>    <head>    </head>    <body>       <img src="/css/images/logo.png" alt="CSS Logo"style="FILTER: Chroma(Color = #000000) Shadow(Color=#00FF00, Direction=225)">       <p>ตัวอย่างข้อความ:</p>       <div style="width: 357;          height: 50;          font-size: 30pt;          font-family:          Arial Black;          color: red;          Filter: Shadow(Color=#0000FF, Direction=225)">CSS Tutorials</div>    </body> </html>.