纯 CSS 密码生成器！😱 他们说这不可能实现……

我见过很多人说“这不可能”，而且......嗯，这不可能（目前）！

然而，在看到Alvaro Motoro 的这篇关于杰夫·贝佐斯每秒赚多少钱的精彩帖子（以及Temani Afif的有用评论）后，我意识到我可以伪造它！

我厚颜无耻地窃取了 Alvaro 帖子中大约 90% 的加价，希望他不介意！

点击黑色方框即可生成密码。再次点击即可启动随机程序，再次选择新的密码！很简单。

注意：正如你们许多人所知，我提倡无障碍，但以下内容是无法访问的，这是一个愚蠢的实验，不应在现实世界中使用。

由于人类的反应时间、渲染时间等，生成相同密码的可能性实际上非常低。

显然，正如我之前所说，我不建议将其用于生产......它实际上不是随机的，它是不可访问的，您无法复制和粘贴生成的密码。

事实上，作为密码生成器它简直是垃圾！

然而，“伪造”随机的原理可以用于各种各样的事物，例如随机颜色选择器、骰子等。

无论如何，由于它无法在生产中使用，我甚至不会解释它，只是想声称自己是第一个创建仅 CSS 密码生成器的人（因为我认为以前没有人这样做过）！

（好的，我会稍微解释一下）。

我们切换复选框，并使用 CSS 来获取其选中状态。当复选框未选中时（我们将其设置为选中状态），我们用它animation-play-state: paused;来停止所有动画。当复选框被选中时，我们取消暂停所有动画。

input:checked + label span.number::before {
  animation-play-state: running;
}

至于动画 - 每个框都以超快的速度在字母和数字之间跳转，每个框的时间不同，因此您会看到随机的外观。

更新

对于任何喜欢 CSS 巫术/巫术的人来说，这里是Temani Afif的“单元素”版本（它是两个元素......我必须在某处深入研究🤣）。

它目前只能在基于 Chromium 的浏览器上运行，但你怎么可能不被它的创造力所折服呢？我想我仅从这个小提琴中就学到了至少 5 个新的 CSS 技巧！

我要说我的更好，因为它使用 62 个字符而不是 26 个...😋