background-clip-text-2.html (789B)
1 <!doctype HTML> 2 <html> 3 <head> 4 <title>background-clip: text shadow</title> 5 <style> 6 div.out { 7 width: 500px; 8 height: 300px; 9 margin: 0px; 10 background-image: linear-gradient(green, green); 11 background-clip: text; 12 color: transparent; 13 font-size: 50px; 14 font-family: serif; 15 text-shadow: 0px 60px 5px red; 16 -moz-osx-font-smoothing: grayscale; 17 } 18 </style> 19 </head> 20 <body style="margin: 0px;"> 21 <div class="out"> 22 Text Shadow 23 <div style="display:inline-block; width:0px; height:100px;"/> 24 </div> 25 <!-- A white div which is used to cover on text --> 26 <div style="position: absolute; top: 0px; left:0px; width:500px; height:110px;background-color:white;"/> 27 </body> 28 </html>