เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง
ความหมายและการใช้งาน
สถานที่ให้บริการกล่องเงาแนบหนึ่งหรือมากกว่าเงาองค์ประกอบ
| ค่าเริ่มต้น: | none |
|---|---|
| รับการถ่ายทอด: | no |
| Animatable: | yes. Read about animatable Try it |
| เวอร์ชัน: | CSS3 |
| ไวยากรณ์ javascript: | object .style.boxShadow="10px 20px 30px blue" Try it |
สนับสนุนเบราว์เซอร์
ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่ทรัพย์สิน
ตามด้วยหมายเลข -webkit- หรือ -moz- ระบุรุ่นแรกที่ทำงานร่วมกับคำนำหน้า
| คุณสมบัติ | |||||
|---|---|---|---|---|---|
| box-shadow | 10.0 4.0 -webkit- | 9.0 | 4.0 3.5 -moz- | 5.1 3.1 -webkit- | 10.5 |
CSS ไวยากรณ์
box-shadow: none|h-shadow v-shadow blur spread color |inset|initial|inherit; Note: คุณสมบัติกล่องเงาแนบหนึ่งหรือมากกว่าเงาองค์ประกอบ โรงแรมแห่งนี้เป็นรายการที่คั่นด้วยเครื่องหมายจุลภาคของเงาที่ระบุไว้ในแต่ละ 2-4 ค่าความยาวสีตัวเลือกและคำหลักที่แทรกตัวเลือก ความยาวงด 0
ค่าทรัพย์สิน
| ความคุ้มค่า | ลักษณะ | เล่น |
|---|---|---|
| none | ค่ามาตรฐาน ไม่มีเงาจะปรากฏ | เล่น " |
| h-shadow | จำเป็นต้องใช้ ตำแหน่งของเงาแนวนอน ค่าลบจะได้รับอนุญาต | เล่น " |
| v-shadow | จำเป็นต้องใช้ ตำแหน่งของเงาแนวตั้ง ค่าลบจะได้รับอนุญาต | เล่น " |
| blur | ไม่จำเป็น. ระยะทางเบลอ | เล่น " |
| spread | ไม่จำเป็น. ขนาดของเงา ค่าลบจะได้รับอนุญาต | เล่น " |
| color | ไม่จำเป็น. สีของเงา ค่าเริ่มต้นเป็นสีดำ ดู CSS ค่าสี สำหรับรายการที่สมบูรณ์ของค่าสีที่เป็นไปได้ หมายเหตุ: ใน Safari (on PC) พารามิเตอร์สีเป็นสิ่งจำเป็น หากคุณไม่ได้ระบุสีเงาจะไม่แสดงที่ทุกคน | เล่น " |
| inset | ไม่จำเป็น. การเปลี่ยนแปลงจากเงาเงาด้านนอก (outset) ไปยังเงาภายใน | เล่น " |
| initial | การตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้น อ่านเกี่ยวกับการเริ่มต้น | เล่น " |
| inherit | สืบทอดคุณสมบัตินี้จากองค์ประกอบหลักของมัน อ่านเกี่ยวกับการรับมรดก |
ตัวอย่างเพิ่มเติม
ภาพโยนบนโต๊ะ
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการสร้าง "polaroid" ภาพและหมุนภาพ
หน้าเว็บที่เกี่ยวข้อง
กวดวิชา CSS3: CSS3 พรมแดน
อ้างอิง HTML DOM: boxShadow property