svg+css实现人工智能迷宫背景动画效果代码
代码语言:html
所属分类:背景
代码描述:svg+css实现人工智能迷宫背景动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
body {
width: 100%;
height: 100vh;
overflow: hidden;
margin: 0px;
padding: 0px;
background: #003655
}
svg {
width: 100%;
}
.st0 {
stroke-dasharray: 2050 1000 40 80 1500 1000 2050;
animation: dash 30s infinite linear;
}
@keyframes dash {
to {
stroke-dashoffset: 4000;
}
}
</style>
</head>
<body>
<svg version="1.1" id="svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 1200 800" style="enable-background:new 0 0 1200 800;" xml:space="preserve">
<style type="text/css">
.st0 {
fill: none;
stroke: #00C3E5;
stroke-width: 1;
stroke-miterlimit: 10;
stroke-dasharray: 60,100,300,120,220,24;
}
</style>
<g>
<path class="st0" d="M620.1,933.2l33.9-33.9l17-17l-17-17l-51.8-51.8l84.9-84.9l-17-17l-84.9,84.9l-17,17l-17.8,17.8l-17-17
l33.9-33.9l17.8-17.8l-16.1-16.1l-17.8-17.8l16.1-16.1l33.9,33.9l17-17l-33.9-33.9l17-17l17-17l-16.1-16.1l-17-17l33.9-33.9l17-17
l25.5-25.5l-17-17l-25.5,25.5l-17.8-17.8l93.3-93.3l-16.1-16.1L654,458l-34.8-34.8l50.9-50.9l16.1-16.1l34.8-34.8L705,305.3
l-34.8,34.8l-17-17l-17-17l-42.4-42.4l-16.1,16.1l42.4,42.4l-84.9,84.9l-17.8,17.8L501.3,441l17,17l16.1-16.1l50.9,50.9l17.8-17.8
l-50.9-50.9l84.9-84.9l17,17l-50.9,50.9l-17,17l16.1,16.1l34.8,34.8l-85.7,85.7l-17.8-17.8l33.9-33.9l-17-17l-33.9,33.9l-17,17
l-33.9,33.9l-16.1-16.1l50.9-50.9l17-17l-17-17l-51.8-51.8l-17,17l51.8,51.8l-50.9,50.9l-25.5-25.5l-17-17l-25.5-25.5l17-17
l50.9,50.9l17-17l-50.9-50.9l-17-17l-17,17l-17,17l-17-17l-17,17l17,17l-67.9,67.9l17,17l67.9-67.9l25.5,25.5l-17,17l17,17l17-17
l25.5,25.5l17,17l16.1,16.1l-16.1,16.1l-16.1-16.1L398.6,576l-17.8,17.8l-33.1,33.1l17.8,17.8l33.1-33.1l16.1,16.1l17,17l17,17
l-17,17l-33.1-33.1l-16.1,16.1l33.1,33.1l-17.8,17.8l-84.9-84.9l-17,17l84.9,84.9l17,17l17-17l17.8-17.8l16.1-16.1l17-17l17.8-17.8
l16.1-16.1l51.8,51.8l-16.1,16.1l-17-17l-17.8-17.8l-17.8,17.8l-16.1,16.1l-17.8,17.8l-33.1,33.1l17.8,17.8l33.1-33.1l33.1,33.1
l17.8-17.8l-33.1-33.1l16.1-16.1l17,17l16.1,16.1l17.8,17.8l-33.9,33.9l-17,17l-34.8-34.8l-17,17l34.8,34.8l16.1,16.1l17-17l17,17
l-17,17l17,17l17-17l33.9,33.9l17-17l-33.9-33.9l17.8-17.8l51.8,51.8l-33.9,33.9L585.3,934l17,17l33.1,33.1l17.8-17.8L620.1,933.2z
M516.6,627.7l-17-17l-17,17l-16.1,16.1l-17-17l16.1-16.1l17-17l33.9-33.9l17.8,17.8l-17,17l16.1,16.1l17-17l17-17l17-17l17.8,17.8
l-33.9,33.9l-17,17l17,17l17,17l-17,17L516.6,627.7z" />
<path class="st0" d="M245.1,559.8l-67,67l-67-67l-17,17l67,67l17.8,17.8l33.1,33.1l17.8,17.8l17-17l17-17l67,67l-17.8,17.8
l-33.1-33.1L262,712.6l-16.1,16.1l-17.8,17.8l-84-84l-17,17l84,84l-42.4,42.4l17.8,17.8l42.4-42.4l17-17l17.8-17.8l33.1,33.1
l17.8,17.8l84.9,84.9l16.1-16.1l-84.9-84.9l17.8-17.8l101.8,101.8l-51.8,51.8l-50.9-50.9l-17-17l-50.9-50.9l-17-17l-16.1,16.1
l-18.7,18.7L212,832.2l-16.1,16.1l17,17l16.1-16.1l50.9,50.9l17,17l16.1-16.1l18.7-18.7l50.9,50.9l17,17l16.1-16.1l51.8-51.8l17-17
l-17-17L365.5,746.5l-17.8-17.8l-67-67l-17.8-17.8l67.9-67.9l17,17l16.1-16.1l-17-17l-17-17L313.8,559l-67.9,67.9l-17,17l17,17
l-17,17l-33.1-33.1l67-67L245.1,559.8z M296,884l-50.9-50.9l18.7-18.7l50.9,50.9L296,884z" />
<polygon class="st0" points="449.6,17.6 432.6,0.7 416.5,16.8 433.4,33.8 450.4,50.7 466.5,34.6 534.4,-33.3 550.5,-17.2
516.6,16.8 534.4,34.6 568.3,0.7 584.5,16.8 601.4,-0.2 585.3,-16.3 618.4,-49.4 600.6,-67.2 567.5,-34.1 551.4,-50.3 534.4,-67.2
499.6,-102 482.6,-85 517.4,-50.3 " />
<polygon class="st0" points="125.4,-304.8 108.4,-287.8 125.4,-270.9 177.2,-219.1 92.3,-134.3 109.3,-117.3 194.1,-202.1
211.1,-219.1 228.9,-236.9 245.9,-220 212,-186 194.1,-168.2 210.3,-152.1 228.1,-134.3 212,-118.1 178,-152.1 161.1,-135.1
195,-101.2 178,-84.2 161.1,-67.2 127.1,-33.3 143.2,-17.2 177.2,-51.1 194.1,-34.1 160.2,-0.2 177.2,16.8 211.1,-17.2
228.1,-34.1 211.1,-51.1 194.1,-68.1 211.1,-85 262.9,-33.3 279.8,-16.3 296.8,-33.3 312.9,-49.4 329.9,-32.4 313.8,-16.3
296.8,0.7 262.9,34.6 245.1,16.8 262,-0.2 245.9,-16.3 228.9,0.7 212,17.6 195,34.6 211.1,50.7 228.1,33.8 245.9,51.6 212,85.5
194.1,67.7 178,51.6 110.1,-16.3 93.2,0.7 161.1,68.5 144.1,85.5 92.3,33.8 75.4,16.8 58.4,-0.2 75.4,-17.2 57.5,-35 40.6,-18
23.6,-1 41.4,16.8 58.4,33.8 8.3,83.8 25.3,100.8 75.4,50.7 127.1,102.5 143.2,118.6 160.2,101.6 177.2,84.7 195,102.5 212,119.5
228.9,102.5 262.9,68.5 279.8,51.6 313.8,17.6 329.9,33.8 279,84.7 262,101.6 279,118.6 338.4,178 355.4,161 296,101.6 346.9,50.7
372.3,76.2 389.3,93.1 414.8,118.6 397.8,135.6 346.9,84.7 329.9,101.6 380.8,152.5 397.8,169.5 414.8,152.5 431.7,135.6
448.7,152.5 465.7,135.6 448.7,118.6 483.5,83.8 500.5,100.8 516.6,84.7 499.6,67.7 516.6,50.7 499.6,33.8 482.6,50.7 466.5,66.8
431.7,101.6 406.3,76.2 423.2,59.2 406.3,42.2 389.3,59.2 363.8,33.8 346.9,16.8 330.8,0.7 346.9,-15.5 363,0.7 380.8,18.5
398.6,0.7 431.7,-32.4 413.9,-50.3 380.8,-17.2 364.7,-33.3 347.7,-50.3 330.8,-67.2 347.7,-84.2 380.8,-51.1 396.9,-67.2
363.8,-100.3 381.7,-118.1 466.5,-33.3 483.5,-50.3 398.6,-135.1 381.7,-152.1 364.7,-135.1 346.9,-117.3 330.8,-101.2
313.8,-84.2 296,-66.4 279.8,-50.3 228.1,-102 244.2,-118.1 261.2,-101.2 279,-83.3 296.8,-101.2 312.9,-117.3 330.8,-135.1
363.8,-168.2 346,-186 312.9,-152.9 279.8,-186 262,-168.2 295.1,-135.1 279,-119 262,-136 245.9,-152.1 228.1,-169.9 262,-203.8
.........完整代码请登录后点击上方下载按钮下载查看
网友评论0