css 如何用波浪线把一些方框元素连接起来?

mwg9r5ms  于 2022-12-15  发布在  其他
关注(0)|答案(1)|浏览(117)

我有一些盒子谁排序3乘3。我想把他们一起波浪线。我知道这是可能的下载SVG波浪线和使用它之间的方块,但有没有任何想法做它与CSS或JavaScript和创建线随机(这是确定的,如果所有的线有相同的看法)?
这就是我的意思:

的数据

iezvtpos

iezvtpos1#

这将是从https://erikmartinjordan.com/style-hr-line-wavy获得的一个解决方案

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <hr>
</body>
<style>
    hr{
    border: none;
}
hr:after{
    content: '∿∿∿∿∿∿∿∿';
    /* Ratio -> font-size/letter-spacing = 6.25 */
    letter-spacing: -9.6px;
    font-size: 60px;
}
</style>
</html>

相关问题