เครื่องมือสร้าง CSS Box Shadow

วิธีใช้ เครื่องมือสร้าง CSS Box Shadow

1. 1

   กำหนดออฟเซ็ต

   ใช้แถบเลื่อนออฟเซ็ตแนวนอนและแนวตั้งเพื่อเลื่อนเงาไปทางซ้าย ขวา ขึ้น หรือลง ค่าแนวตั้งที่เป็นบวกจะทำให้เงาตกลงด้านล่างขององค์ประกอบ ส่วนค่าที่เป็นลบจะยกเงาขึ้นด้านบน

2. 2

   จัดรูปทรงของเงา

   เพิ่มความเบลอเพื่อให้ขอบนุ่มและฟุ้ง หรือคงค่าให้ต่ำเพื่อเงาที่คมชัด ส่วนการกระจายจะขยายหรือย่อขนาดเงาก่อนที่จะใส่ความเบลอ

3. 3

   เลือกสีและความทึบ

   คลิกที่ช่องสีเพื่อเลือกสีของเงา แล้วกำหนดความทึบ เงาสีเข้มที่นุ่มและมีความทึบต่ำมักดูเป็นธรรมชาติที่สุดบนพื้นหลังสว่าง

4. 4

   คัดลอกโค้ด CSS

   สลับเป็น inset หากต้องการเงาด้านใน ดูตัวอย่างบนพื้นหลังสว่างหรือมืด แล้วคัดลอกบรรทัด box-shadow ไปวางในสไตล์ชีตของคุณ

คำถามที่พบบ่อย

เครื่องมือที่เกี่ยวข้อง

ทำงานต่อด้วยเครื่องมือที่มีประโยชน์เหล่านี้