HTML คุณสมบัติผ้าใบ shadowOffsetY
คู่มือการใช้งาน HTML ผ้าใบอ้างอิง
ตัวอย่าง
วาดรูปสี่เหลี่ยมผืนผ้าที่มีเงาชดเชยลดลง 20 พิกเซล (จากตำแหน่งบนสุดของสี่เหลี่ยม) A:
javascript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.shadowBlur=10;
ctx.shadowOffsetY=20;
ctx.shadowColor="black";
ctx.fillStyle="red";
ctx.fillRect(20,20,100,80);
var ctx=c.getContext("2d");
ctx.shadowBlur=10;
ctx.shadowOffsetY=20;
ctx.shadowColor="black";
ctx.fillStyle="red";
ctx.fillRect(20,20,100,80);
ลอง»
สนับสนุนเบราว์เซอร์
Internet Explorer 9, Firefox, Opera, Chrome และ Safari คุณสมบัติการสนับสนุน shadowOffsetY
หมายเหตุ: 8 และรุ่นก่อนหน้าของ Internet Explorer ไม่สนับสนุน <ผ้าใบ> องค์ประกอบ
ความหมายและการใช้งาน
การตั้งค่าคุณสมบัติ shadowOffsetY หรือผลตอบแทนระยะทางแนวตั้งของรูปร่างเงา
shadowOffsety = 0 แสดงให้เห็นเพียงด้านล่างรูปร่างเงาอยู่
shadowOffsetY = 20 แสดงให้เห็นรูปร่างของเงาตั้งอยู่ที่ 20 พิกเซลด้านล่างตำแหน่งบนสุด
shadowOffsetY = -20 แสดงให้เห็นรูปร่างของเงาของตำแหน่งบนสุด 20 พิกเซลดังกล่าวข้างต้น
เคล็ดลับ: ในการปรับรูปร่างของเงาและระยะทางแนวนอนใช้ shadowOffsetX คุณสมบัติ
| เริ่มต้น: | 0 |
|---|---|
| ไวยากรณ์ javascript: | บริบท.shadowOffsetY = จำนวน; |
มูลค่าทรัพย์สิน
| 值 | 描述 |
|---|---|
| number | 正值或负值，定义阴影与形状的垂直距离。 |
คู่มือการใช้งาน HTML ผ้าใบอ้างอิง