我正在尝试实现一个CSS globe样式,我在这个链接中找到了:
https://speckyboy.com/particle-animation-code-snippets/(粒子Orb CSS by Nate Wiley)样式.
在这里您可以看到他们正在使用SCSS代码.我已经转换了SCSS代码CSS代码.现在,他们还在HTML部分中使用了以下代码:
%div.wrap
-300.times do
%div.c
如何将该代码转换为普通HTML?
最佳答案 这是编译版本.
<div class='wrap'>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
<div class='c'></div>
</div>