这个是啥？

马黑黑

马黑黑

可以尝试这样修改一些特定值：


<div class="paBox" style="background: repeating-radial-gradient(circle, transparent, black,transparent, gray 18%); "></div>

马黑黑

马黑黑

一楼源码：

1. <style type="text/css">
   
2. 
   
3. .paBox {
   
4.         margin: 10px auto;
   
5.         width: 400px;
   
6.         height: 400px;
   
7.         border:1px solid;
   
8.         position: relative;
   
9.         border-radius: 50%;
   
10.         background: darkred;
    
11. }
    
12. 
    
13. .paBox::before {
    
14.         content:"";
    
15.         position: absolute;
    
16.         left: 0; top: 0;
    
17.         background: repeating-radial-gradient(circle, transparent, black,transparent, gray 8%);
    
18.         width: 400px;
    
19.         height: 400px;
    
20.         border-radius: 50%;
    
21.         opacity: 0.9;
    
22. }
    
23. 
    
24. </style>
    
25. 
    
26. <div class="paBox"></div>

复制代码

红影

哇，这个纯代码弄出来的图案很有质感啊。黑黑厉害

红影

马黑黑 发表于 2022-1-25 13:40
可以尝试这样修改一些特定值：

哦，好像百分比大把红都给挤没了

我不去动颜色，来试试把百分比降低点，例如
<div class="paBox" style="background: repeating-radial-gradient(circle, transparent, black,transparent, gray 4%); "></div>

红影

红影

红影

这个是，打靶：十环

加林森

加林森

加林森

加林森

老黑的代码很厉害啊。佩服佩服。

马黑黑

加林森 发表于 2022-1-25 17:54
老黑的代码很厉害啊。佩服佩服。

感谢支持

加林森

马黑黑 发表于 2022-1-25 20:33
感谢支持

应该的应该的

马黑黑

加林森 发表于 2022-1-25 20:35
应该的应该的

马黑黑

红影 发表于 2022-1-25 14:08
这个是，打靶：十环

挺好。不过，其实这个，应该用两个独立的 div 叠加，这样操纵的自由度会高得多。

加林森

马黑黑 发表于 2022-1-25 20:40

马黑黑

东篱闲人

蚊香。