淘先锋技术网

首页 1 2 3 4 5 6 7

CSS最短的游戏,指的是用尽量少的代码完成游戏的制作。以下是一款CSS最短的游戏的示例:

html{scrollbar-width:none;}
body{display:flex;align-items:center;justify-content:center;height:100vh;margin:0;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAFUlEQVQI12P4//8/AAX+Av7czFnnAAAAAElFTkSuQmCC)}
span{font-size:72px;color:#fff;text-shadow:0 0 10px #000;cursor:pointer;animation:2s ease-out half-pingpong}
span:hover{animation:0s}
@keyframes half-pingpong{50%{text-shadow:none}}

这个游戏是一个简单的点击游戏。当鼠标移动到页面上的白色方块上时,方块就会变为黑色,让玩家进行点击。代码中,我们可以看到CSS属性被大量压缩,用尽量少的代码完成了游戏的制作。