非常立体的字,偶然在某个系统看到的,扒下来以备日后使用。原始页面上还有鼠标移动到某个字上就会有“点亮”的效果,不知道怎么实现的,我仔细查看了它的css代码以及事件,发现都没有。实在是很疑惑,如果有谁知道请告之。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> </head> <style> p{ padding-top: 100px; text-align: center; font-size: 75px; font-weight: 700; line-height: 100px; letter-spacing: 5px; color: #fff; margin-bottom: 30px; } p span { cursor: pointer; text-shadow: 0 0 2px #686868, 0 1px 1px #ddd, 0 2px 1px #d6d6d6, 0 3px 1px #ccc, 0 4px 1px #c5c5c5, 0 5px 1px #c1c1c1, 0 6px 1px #bbb, 0 7px 1px #777, 0 8px 3px hsl(0deg 0% 39% / 40%), 0 9px 5px hsl(0deg 0% 39% / 10%), 0 10px 7px hsl(0deg 0% 39% / 15%), 0 11px 9px hsl(0deg 0% 39% / 20%), 0 12px 11px hsl(0deg 0% 39% / 25%), 0 13px 15px hsl(0deg 0% 39% / 30%); transition: all 1s cubic-bezier(0.53, -0.44, 1, 1); } </style> <body> <p><span>欢</span><span>迎</span><span>使</span><span>用勒索病毒</span></p> </body> </html>