神兽保佑代码无bug O(∩_∩)O

最新推荐文章于 2025-07-02 09:15:15 发布

Chandler1986

最新推荐文章于 2025-07-02 09:15:15 发布

阅读量251

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/jessical626/p/7133215.html

本文介绍了一种使用HTML、CSS及console.log方法实现的动态炫彩Hello World显示方式，并展示了如何在网页中创建有趣的动画效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">

.gomyblog {
display:inline-block;
animation:lol 0.5s infinite 3s;
-webkit-animation:lol 0.5s infinite 3s;

}
@keyframes lol {
0% {transform:rotate(0deg)}
33% {transform:rotate(30deg)}
66% {transform:rotate(0deg)}
100% {transform:rotate(-30deg)}
}
@-webkit-keyframes lol {
0% {-webkit-transform:rotate(0deg)}
33% {-webkit-transform:rotate(30deg)}
66% {-webkit-transform:rotate(0deg)}
100% {-webkit-transform:rotate(-30deg)}
}

</style>
</head>
<body>
<pre>
**
*　　┏┓　　　┏┓+ +
*　┏┛┻━━━┛┻┓ + +
*　┃　　　　　　　┃ 　
*　┃　　　━　　　┃ ++ + + +
<span class="gomyblog">* ████━████ ┃+</span>

*　┃　　　　　　　┃ +
*　┃　　　┻　　　┃
*　┃　　　　　　　┃ + +
*　┗━┓　　　┏━┛
*　　　┃　　　┃　　　　　　　　　　　
*　　　┃　　　┃ + + + +
*　　　┃　　　┃
*　　　┃　　　┃ + 神兽保佑
*　　　┃　　　┃ 代码无bug　　
*　　　┃　　　┃　　+　　　　　　　　　
*　　　┃　　　┗━━━┓ + +
*　　　┃ 　　　　　　　┣┓
*　　　┃ 　　　　　　　┏┛
*　　　┗┓┓┏━┳┓┏┛ + + + +
*　　　　┃┫┫　┃┫┫
*　　　　┗┻┛　┗┻┛+ + + +
*
</pre>
</body>
</html>

console.log('%chello world', 'background-image:-webkit-gradient( linear, left top, right top, color-stop(0, #f22), color-stop(0.15, #f2f), color-stop(0.3, #22f), color-stop(0.45, #2ff), color-stop(0.6, #2f2),color-stop(0.75, #2f2), color-stop(0.9, #ff2), color-stop(1, #f22) );color:transparent;-webkit-background-clip: text;font-size:5em;');

转载于:https://www.cnblogs.com/jessical626/p/7133215.html