คุณสมบัติ text-shadow ใน CSS2 ทำให้ง่ายต่อการเพิ่มเงาให้กับข้อความในหน้าเว็บ แต่จนถึงขณะนี้มีเพียง Safari บน OS X เท่านั้นที่สนับสนุน วันนี้เราจะสร้างเอฟเฟกต์เงาข้อความ CSS สำหรับเบราว์เซอร์อื่น ๆ รวมถึง Firefox และสามารถทำได้ ผ่านการตรวจสอบ w3
คุณสมบัติ text-shadow ที่มีการพูดคุยกันมานานหลายปี ช่วยให้คุณสามารถควบคุมสี การชดเชย และความเบลอของเงาบนองค์ประกอบของหน้าได้ แม้ว่าจะยังไม่ได้รับการรองรับอย่างกว้างขวาง แต่นักออกแบบบางคนก็เริ่มตัดสินใจใช้ข้อความ CSS- ทรัพย์สินเงาทุกที่ แม้ว่าจะได้รับการออกแบบมาเพื่อปรับปรุงฟังก์ชันการทำงานสำหรับผู้ใช้จำนวนน้อยเท่านั้น
ต่อไปนี้เป็นตัวอย่าง เมื่อใช้ ให้ใส่ใจกับตำแหน่ง:ญาติของ a และตำแหน่ง:absoluteview plaincopy to clipboardprint?
<สไตล์>
ul, li { ระยะขอบ: 0px; การขยาย: 0px; list-style-type: none;}
#nav{font-family: Verdana, "宋体", Arial;}
#nav li { ลอย: ซ้าย;
#nav ช่วง {จอแสดงผล: ไม่มี;}
#nav a{font-size:12px;font-weight:old;color: #FF6600;text- decoration: none; display:block;}
#nav a:hover{ color:#999;top:1px; left:1px;
#nav a:hover span{ จอแสดงผล:บล็อก; ด้านบน:-2px; ตำแหน่ง:สัมบูรณ์; สี:#FF3300;เคอร์เซอร์:ตัวชี้;}
<สไตล์>
ul, li { ระยะขอบ: 0px; การขยาย: 0px; list-style-type: none;}
#nav{font-family: Verdana, "宋体", Arial;}
#nav li { ลอย: ซ้าย;
#nav ช่วง {จอแสดงผล: ไม่มี;}
#nav a{font-size:12px;font-weight:old;color: #FF6600;text- decoration: none; display:block;}
#nav a:hover{ color:#999;top:1px; left:1px;
#nav a:hover span{ จอแสดงผล:บล็อก; ด้านบน:-2px; ตำแหน่ง:สัมบูรณ์; สี:#FF3300;เคอร์เซอร์:ตัวชี้;}
ดูสำเนาธรรมดาไปยังคลิปบอร์ดพริ้นท์หรือไม่