Thuộc tính HTML DOM style textShadow trả về và áp dụng những gì sẽ xảy ra khi luồng văn bản bên ngoài vùng chứa phần tử trong tài liệu HTML.
Cú pháp
Sau đây là cú pháp -
-
Trả lại textShadow
object.style.textShadow
-
Sửa đổi textShadow
object.style.textShadow = “value”
Giá trị
Ở đây, giá trị có thể là -
Giá trị | Giải thích |
---|---|
inherit | Nó kế thừa giá trị thuộc tính này từ phần tử mẹ của nó. |
đầu tiên | Nó đặt giá trị thuộc tính này thành giá trị mặc định. |
không có | Nó không tạo bóng trên văn bản. |
màu mờ h-shadow v-shadow | Nó đặt bóng trên văn bản. Đây h-shadow đại diện cho giá trị của bóng ngang. v-shadow đại diện cho giá trị của bóng dọc. mờ đại diện cho khoảng cách mờ. màu đại diện cho màu của bóng. |
Ví dụ
Hãy để chúng tôi xem một ví dụ về thuộc tính style textShadow -
<!DOCTYPE html> <html> <head> <style> body { color: #000; background: lightblue; height: 100vh; } p { margin: 1.5rem auto; } .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; } </style> </head> <body> <h1>DOM Style textShadow Property Example</h1> <p>Some Dummy Text</p> <button onclick="add()" class="btn">Set textShadow</button> <script> function add() { document.querySelector('p').style.textShadow = "10px 10px 2px #db133a"; } </script> </body> </html>
Đầu ra
Điều này sẽ tạo ra kết quả sau -
Nhấp vào “ Đặt textShadow ”Để áp dụng bóng trên văn bản đoạn văn.