要为stroke-dashoffset
设置动画,我知道使用CSS @keyframes
移动SVG路径的stroke-dashoffset
。但是,由于我想用background-size: cover
调整SVG的大小,因此我无法定位SVG中的各个元素,因为在CSS中它被称为background-image
。
是否可以使用SVG内置的<animate />
标签为stroke-dashoffset
设置动画?
答案 0 :(得分:2)
通过将stroke-dashoffset
从最大值更改为零来实现绘制线从零到最大值的动画。
添加了第二个动画-用绘制线条的动画完成后开始的颜色填充。
<animate id="f1"
attributeName="fill"
begin="p1.end+0.4s"
dur="10s"
values="#FCFCFC;#A9A9A9;black;#A9A9A9;#FCFCFC"
/>
使用以下属性完成线条的绘制和擦除:
values="2037;0;2037"
.txt {
font-size:1.2em;
color:gray;
}
h1 {
text-align: center;
}
.lion {
padding:0.25em;
margin-left:-1.5em;
float:left;
}
<body>
<h1>Lion</h1>
<div class="lion">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
width="200" height="200" viewBox="-30 85 600 600"
style="border:0px dotted red;">
<title>The animation is drawing lines</title>
<g transform="scale(0.85) ">
<path class="path" fill="none" stroke-width="2" stroke ="black" stroke-dasharray= "2000" stroke-dashoffset="2000" d="m272.2 113.6c-0.3 0-0.6 0-0.9 0.1-0.7 0.1 2.2 2.5 10.9 11.2 9.8 9.7 18.2 19.1 23 25.5 5.9 8.1 12.3 18.6 16.4 29.1 0.8 1.6 3.6 11.9 4.6 16.9 0.5 2.8 1 5.4 1.2 5.8 0.8 2.5 3.9-8.4 4.8-13 1.2-5.6 1.2-11.4 1-17.1-0.2-5.8-0.5-11.8-2.2-17.4-1.4-4.8-3.6-9.4-6.7-13.3-6.6-8.2-15.1-15.1-24.4-20.1-6.4-3.5-13.8-4.9-20.9-6.5-2.2-0.5-4.8-1.3-6.9-1.2zm194.7 0c-2.1 0-4.7 0.7-6.9 1.2-7.1 1.6-14.5 3.1-20.9 6.5-9.3 5-17.8 11.8-24.4 20.1-3.1 3.9-5.3 8.6-6.7 13.3-1.7 5.6-2 11.5-2.2 17.4-0.2 5.7-0.1 11.5 1 17.1 1 4.5 4 15.4 4.8 13 0.1-0.3 0.6-2.9 1.2-5.8 0.9-5 3.7-15.3 4.6-16.9 4.2-10.5 10.5-21 16.5-29.1 4.8-6.5 13.2-15.8 23-25.5 8.7-8.7 11.6-11.1 10.9-11.2-0.3 0-0.6-0.1-0.9-0.1zm-97.3 24.5c-0.8-0.1-1.4 5.7-2 8.5-0.9 4.3-1.3 8.7-2.4 12.9-1.8 6.9-4.3 13.7-7.1 20.3-2.4 5.7-6.4 13.4-8.3 16.5-5.5 8.8-9 13.7-13.9 19.6-6.1 7.3-7.4 8.8-13 14.4-10.8 10.8-19.3 15.7-30 22.1-7.3 4.4-15.3 7.6-23.1 11-17.5 7.6-36.3 14.2-55.9 20.5-12.8 4.3-26.1 7.4-38.3 13.1-18.2 8.6-36.3 18.5-51.6 31.6-11.5 9.9-21.1 22.1-29.5 34.7-5.1 7.7-9 15.2-12.6 24.7-3 6.3-4.8 12.7-6.7 19.3-1.5 5.2-3 9.8-3.6 15.7-0.3 1.9-0.8 4.5-1.1 5.7-0.9 3.4-1.3 7.6-0.7 9 0.3 1.3 1.9 1.5 2.4 0 0.5-1.4 0.7-1.8 1.5-3.1 1.8-2.9 4.4-7 6.9-10.3 9.6-12.2 19.7-24.2 31.5-34.2 14.4-12.3 30.6-22.3 47.2-31.4 18.1-10 36.9-17 56.7-25.4 7.8-3.4 14.4-5.6 23.2-10.3 2.6-1.8 3.7-1.2 2.7 1.4-0.4 0.9-0.7 2.7-0.8 4-0.2 3 0.6 3.7 2.9 2.8 1.8-0.7 2.7-1 7.8-2.6 2.2-0.7 4.1-1.5 4.3-1.9 0.3-0.7-3.8-5-7.9-8.4-2.3-1.9-4.7-4.8-4.3-5.2 0.1-0.1 2 0 3.1 0.1 2.4 0.3 2.9 0.3 10.1 0.5 11.4 0.4 11.6 0.6 10-3.5-1.3-3.3-2.6-6.3-3.9-9.7-0.7-1.3-1.1-2.5-0.9-2.7 0.2-0.2 3.6-0.5 7.9-0.5 4.2 0 8.8-0.2 10.2-0.4l2.5-0.4c1-1-0.1-4.6-0.4-6.9-0.2-1.7-0.8-3.8-1-5.2s-0.4-3.3-0.5-4.2c-0.2-1 0-1.7 0.4-1.9 0.5-0.2 1.4-0.1 2.7 0.5 1.1 0.5 3.2 1.3 4.7 1.9 1.5 0.5 3.8 1.4 5 1.9 2.7 1 4.1 1.1 4.6 0.3 0.5-0.7 1.5-3.4 1.9-5.1 1.4-5.1 11-19.2 13.7-20.1 0.8-0.2 3.4 1.4 4.6 2.4 0.4 0.4 7.6 6 9.2 7.1 1.5 0.9 2.6 0.8 3-0.5 0.1-0.4 0.6-1.6 1.1-2.6 1.8-3.9 3.7-7.2 6.6-14 0.6-2.6 1.5-1.9 5.2 4.1 5.3 8.4 12.5 15.8 21.2 21.6 3.3 2.2 2.6 1.8 4.3 2.7 1.7-0.9 1-0.5 4.3-2.7 8.7-5.8 16-13.2 21.2-21.6 3.8-6 4.7-6.7 5.2-4.1 2.9 6.7 4.8 10.1 6.6 14 0.5 1 1 2.2 1.1 2.6 0.4 1.2 1.5 1.4 3 0.5 1.6-1 8.8-6.7 9.2-7.1 1.2-1.1 3.8-2.7 4.6-2.4 2.7 0.9 12.4 15 13.7 20.1 0.5 1.8 1.5 4.4 1.9 5.1 0.5 0.8 2 0.7 4.6-0.3 1.3-0.5 3.5-1.3 5-1.9 1.5-0.5 3.6-1.4 4.7-1.9 1.3-0.6 2.2-0.8 2.7-0.5 0.5 0.2 0.6 0.8 0.4 1.9-0.1 0.9-0.4 2.8-0.5 4.2-0.2 1.4-0.7 3.4-1 5.2-0.3 2.3-1.3 5.9-0.4 6.9l2.5 0.4c1.4 0.2 6 0.4 10.2 0.4 4.3 0 7.8 0.2 7.9 0.5 0.1 0.2-0.3 1.5-0.9 2.7-1.4 3.3-2.7 6.4-3.9 9.7-1.6 4.1-1.4 3.8 10 3.5 7.2-0.2 7.8-0.2 10.1-0.5 1.1-0.1 3-0.2 3.1-0.1 0.4 0.4-1.9 3.2-4.3 5.2-4.1 3.4-8.1 7.7-7.9 8.4 0.1 0.4 2.1 1.2 4.3 1.9 5.1 1.6 6 1.9 7.8 2.6 2.3 0.9 3.1 0.2 2.9-2.8-0.1-1.3-0.4-3.1-0.8-4-1.1-2.6 0.1-3.2 2.7-1.4 8.8 4.8 15.5 7 23.2 10.3 19.9 8.4 38.6 15.4 56.7 25.4 16.5 9.1 32.8 19.1 47.2 31.4 11.8 10.1 21.9 22.1 31.5 34.2 2.6 3.2 5.2 7.3 6.9 10.3 0.8 1.3 1 1.7 1.5 3.1 0.4 1.5 2 1.3 2.4 0 0.5-1.4 0.2-5.6-0.7-9-0.3-1.3-0.8-3.8-1.1-5.7-0.6-5.9-2.1-10.5-3.6-15.7-1.9-6.5-3.7-13-6.7-19.3-3.6-9.4-7.4-17-12.6-24.7-8.4-12.6-17.9-24.8-29.5-34.7-15.3-13.1-33.4-23-51.6-31.6-12.2-5.7-25.5-8.8-38.3-13.1-19.6-6.4-38.4-12.9-55.9-20.5-7.8-3.4-15.8-6.6-23.1-11-10.6-6.4-19.1-11.2-30-22.1-5.6-5.6-7-7.1-13-14.4-4.9-5.9-8.4-10.8-13.9-19.6-1.9-3.1-5.9-10.8-8.3-16.5-2.8-6.6-5.3-13.4-7.1-20.3-1.1-4.2-1.5-8.6-2.4-12.9-0.6-2.9-1.2-8.6-2-8.5zm-120.2 11.9c-4.1 0-8.1 0.5-12 1.5-10.1 2.7-17.7 8-27.5 15.2-2.3 1.7-3.5 3.1-2.6 3.6 0.4 0.2 8.4-1.8 13.8-2.1 10.7-0.5 21.5 1.6 31.8 4.4 10.7 2.9 20.8 7.9 30.8 12.8 5.7 2.8 10.1 5.5 16.5 9.3 4.9 2.9 4.9 1.3 1.3-4-2.1-3.2-4.2-7.2-6.7-10.6-3.9-5.3-7.7-10.7-12.6-14.9-6.9-5.9-14.7-11.6-23.5-14-3-0.8-6.1-1.2-9.3-1.2zm240.4 0c-3.2 0-6.3 0.4-9.3 1.2-8.8 2.4-16.5 8.1-23.5 14-5 4.2-8.8 9.7-12.6 14.9-2.5 3.4-4.6 7.4-6.7 10.6-3.6 5.3-3.6 6.8 1.3 4 6.5-3.8 10.9-6.5 16.5-9.3 10-4.8 20-9.9 30.8-12.8 10.3-2.8 21.1-4.9 31.8-4.4 5.4 0.3 13.5 2.3 13.8 2.1 0.9-0.6-0.3-2-2.6-3.6-9.8-7.3-17.4-12.5-27.5-15.2-3.9-1-8-1.6-12-1.5zm-263.5 27.1c-7.5 0.1-14.8 2.1-22.2 5-2.8 1.1-12 6.4-14.9 8.6-8 6.1-15.3 13.1-24.4 23.2-7.8 8.7-8.9 10.1-8.9 11.1 0 0.8 2.3 0.5 5.1-0.7 6.1-2.7 13.7-5.8 20.7-8.1 7-2.3 14-4.6 21.2-5.7 7.8-1.2 15.9-1.8 23.8-1.2 8.8 0.7 17.1 4.5 25.9 5.4 10.8 1.1 21.9 1.4 32.6-0.3 5.5-0.8 10.8-3 16-4.9 2.9-1 7.7-3.1 8.5-3.4 1.9-0.7 2.6-1.4 2.3-2.2-0.2-0.5-1.7-0.7-5.9-0.9-9.2-0.5-20.5-3.8-30.3-7.3-5.6-2-10.9-5.1-16.2-7.8-10.8-5.5-19.4-10.7-31.8-10.9-0.5 0-1 0-1.5 0zm285.2 0c-12.4 0.2-20.9 5.4-31.8 10.9-5.4 2.7-10.5 5.8-16.2 7.8-9.8 3.5-21.1 6.8-30.3 7.3-4.2 0.2-5.7 0.4-5.9 0.9-0.3 0.8 0.4 1.5 2.3 2.2 0.8 0.3 5.6 2.4 8.5 3.4 5.3 1.8 10.5 4 16 4.9 10.7 1.6 21.8 1.3 32.6 0.3 8.8-0.9 17.1-4.7 25.9-5.4 7.9-0.6 15.9 0 23.8 1.2 7.2 1.1 14.3 3.4 21.2 5.7 7.1 2.3 14.6 5.4 20.7 8.1 2.8 1.2 5.1 1.5 5.1 0.7 0-1-1.1-2.4-9-11.1-9.1-10.2-16.4-17.1-24.4-23.2-2.9-2.2-12.1-7.5-14.9-8.6-7.9-3.1-15.7-5.1-23.8-5zm-188.9 30.7c-0.8 0.1-2.8 1.5-7 4.8-5.6 4.5-10.1 7-16.2 9.1-7.9 2.7-14 4.1-21.2 5.1-8.7 1.2-17.5 1-26.3 1.1-6.8 0.1-13.6-0.1-20.3-0.2-12.3-0.2-23.9-1.1-37-0.8-8.6 0.5-17.3 0.9-25.6 3-8.1 2-16.1 4.9-23.3 9.2-5.5 3.3-10.3 7.8-14.8 12.5-4.3 4.5-8 9.5-11.2 14.7-3.1 5-5.8 10.4-8 15.9-2.4 5.7-4.1 11.7-5.7 17.7-0.5 1.9-0.9 4.2-1.3 5.9-0.4 1.7-1.2 4.3-1 4.8 0.3 0.9 1.7 0.6 3.3-0.4 0.8-0.5 9.5-6.3 14.4-9.2 8.9-5.1 18.1-9.7 27.4-13.9 6.5-2.9 13.1-5.5 19.9-7.8 14.5-4.9 29.3-9 44.2-12.5 7.8-1.9 15.9-2.6 23.7-4.6 11.4-2.9 22.9-5.7 33.6-10.5 11.7-5.3 22.9-11.9 33.1-19.8 4.1-3.2 8.7-7.9 11-10.9 4.9-6.2 6.3-7.9 7.6-9.7 0.8-1.1 1.5-2.4 1.5-2.7 0-0.5-0.1-0.7-0.5-0.7zm94.1 0c-0.4 0-0.5 0.2-0.5 0.7 0 0.4 0.7 1.6 1.5 2.7 1.3 1.8 2.6 3.5 7.6 9.7 2.3 2.9 6.9 7.7 11 10.9 10.2 7.9 21.3 14.6 33.1 19.8 10.7 4.8 22.2 7.6 33.6 10.5 7.8 2 15.9 2.7 23.7 4.6 14.9 3.6 29.7 7.6 44.2 12.5 6.7 2.3 13.4 4.9 19.9 7.8 9.4 4.2 18.5 8.8 27.4 13.9 4.9 2.8 13.6 8.6 14.4 9.2 1.5 1 3 1.3 3.3 0.4 0.1-0.5-0.6-3.1-1-4.8-0.4-1.7-0.8-4-1.3-5.9-1.6-6-3.4-11.9-5.7-17.6-2.3-5.5-4.9-10.8-8-15.9-3.3-5.2-7-10.2-11.3-14.7-4.4-4.7-9.2-9.2-14.8-12.5-7.2-4.3-15.2-7.2-23.3-9.2-8.3-2.1-17-2.5-25.6-3-13.1-0.2-24.7 0.6-37 0.8-6.8 0.1-13.6 0.3-20.3 0.2-8.8-0.1-17.6 0.1-26.3-1.1-7.2-1-13.4-2.4-21.2-5.1-6.1-2.1-10.6-4.6-16.2-9.1-4.2-3.3-6.2-4.8-7-4.8zm-124.5 123.7-5.4 3.6c-3 2-7.9 5.1-10.9 6.8-10.8 6.3-11.8 7-12.2 7.6-0.5 1 1.2 2.9 3.7 4l2.1 0.9 3.7-1.5c2-0.8 4.4-1.5 5.2-1.5 1.4 0 1.6 0.1 2.1 1.8 0.3 1 0.7 2.6 0.9 3.6 0.4 2.4 2.2 3.9 7.3 6.4 6.8 3.3 9.6 4 16.7 4.2 8.9 0.3 8.2-0.1 8.2 4.4 0 2.1-0.3 4.8-0.7 6-0.8 2.6-0.9 4.3-0.3 4.3 0.6 0 4.5-1.7 6.1-2.6 2.6-1.5 2.7-1 2.5 7.5-0.3 11.5-1.5 17.1-8 37.1-2.1 6.7-4.2 13.1-4.6 14.3-0.4 1.2-0.6 2.5-0.4 2.9 0.1 0.4 0.4 0.7 0.6 0.7 1.2 0 13.5-30.8 17.4-43.4 1.9-6.2 3.8-17.7 3.8-23.4 0-1.1 0.3-2.2 0.7-2.7 0.6-0.7 0.7-1.1 0.2-2.8-0.3-1.1-0.8-4.9-1.2-8.4-0.8-7.8-2-11.6-4.3-14-2.2-2.3-7.3-4.4-13-5.3-4.9-0.8-6.3-1.5-6.3-3.5 0-0.6-0.3-1.3-0.6-1.6-0.7-0.6-1.5-0.1-6.8 4.7-3.6 3.2-5 3.7-5.3 1.8-0.1-0.8 0.6-1.4 3.1-3.2 3.2-2.1 4.6-3.5 4.6-4.6 0-0.3-2-1.4-4.5-2.5l-4.5-2zm155.6 0-4.5 2c-2.5 1.1-4.5 2.2-4.5 2.5 0 1 1.4 2.4 4.6 4.6 2.6 1.7 3.2 2.4 3.1 3.2-0.3 1.9-1.7 1.4-5.3-1.8-5.3-4.7-6-5.3-6.8-4.7-0.3 0.3-0.6 1-0.6 1.6 0 2-1.4 2.7-6.3 3.5-5.7 0.9-10.8 2.9-13 5.3-2.3 2.4-3.5 6.2-4.3 14-0.4 3.5-0.9 7.3-1.2 8.4-0.4 1.7-0.4 2.1 0.2 2.8 0.4 0.5 0.7 1.6 0.7 2.7 0 3.3 0.9 11.1 1.9 15.9 1.4 6.7 2.4 10 7.8 24.4 4.1 10.8 4.7 12.5 8.1 20 1.6 3.6 3.1 6.5 3.3 6.5 0.8 0 0.9-1.4 0.2-3.5-0.4-1.2-2.4-7.6-4.6-14.3-6.4-20-7.6-25.6-8-37.1-0.2-8.5-0.1-8.9 2.5-7.5 1.6 0.9 5.6 2.6 6.1 2.6 0.6 0 0.5-1.7-0.3-4.3-0.4-1.2-0.7-3.9-0.7-6 0-4.5-0.7-4.2 8.2-4.4 7-0.2 9.9-0.9 16.7-4.2 5.1-2.5 6.9-4.1 7.3-6.4 0.2-1 0.6-2.6 0.9-3.6 0.5-1.7 0.7-1.8 2.1-1.8 0.9 0 3.2 0.7 5.2 1.5l3.7 1.5 2.1-0.9c2.4-1.1 4.2-3 3.6-4-0.4-0.6-1.4-1.3-12.2-7.6-3-1.8-7.9-4.8-10.9-6.8l-5.4-3.6zm-220.2 8.8c-0.3 0-1.9 0.9-3.6 2.1-4.4 2.9-11.1 5.9-16.7 8.9-9.7 5.2-19.6 9.9-29.1 15.5-9.9 5.8-19.8 11.8-29.2 18.4-8.8 6.2-17.9 12.2-25.4 19.8-9.3 9.5-17.7 20.1-24 31.8-4.6 8.4-7.6 17.5-9.7 27.1-0.9 1.7-3.3 15.1-4.1 22.7-0.8 7.4-0.9 14.8-0.8 22.2 0.2 9.4 1 18.8 2.2 28.1 0.6 5.2 1.7 10.4 2.7 15.5 0.8 4.2 1.7 8.4 2.6 12.6 0.2 1.1 0.5 3 0.8 3.3 0.7 0.9 2.2 0.7 2.6-0.5 0.2-0.6 0.6-2.9 0.9-5.1 0.3-2.2 0.7-3.7 1.1-5.5 0.9-3.5 1.9-7.1 3-10.5 1.6-5 3.4-10.1 5.5-14.9 3.4-7.7 7.5-15.2 11.8-22.5 2.8-4.7 5.8-9.3 9-13.8 4.3-6 8.8-11.8 13.7-17.4 8.4-9.6 17.4-18.7 26.8-27.3 11-10.1 23.1-19 34.7-28.4 6.7-5.4 13.6-10.7 20.3-16.1 7.1-5.7 12-10.4 15.2-14.8 3.6-4.9 7-12.7 7.3-17.1 0.2-2.5 0.1-2.8-1.4-4.3-4.6-5-7.3-10.2-10.5-16.5-2.1-4.4-3-7-3.3-9-0.3-1.9-1.7-4.2-2.6-4.2zm284.3 0c-0.9 0-2.3 2.3-2.6 4.2-0.3 2-1.3 4.6-3.3 9-3.2 6.3-6 11.5-10.5 16.5-1.5 1.6-1.6 1.8-1.4 4.3 0.3 4.4 3.7 12.2 7.3 17.1 3.2 4.3 8.1 9.1 15.2 14.8 6.7 5.4 13.6 10.7 20.3 16.1 11.6 9.4 23.7 18.3 34.7 28.4 9.4 8.6 18.3 17.8 26.8 27.3 4.9 5.5 9.4 11.4 13.7 17.4 3.2 4.5 6.2 9.1 9 13.8 4.3 7.3 8.3 14.7 11.8 22.5 2.2 4.8 3.9 9.9 5.5 14.9 1.1 3.5 2.1 7 3 10.5 0.4 1.8 0.8 3.2 1.1 5.5 0.3 2.2 0.7 4.5 0.9 5.1 0.4 1.1 1.8 1.4 2.6 0.5 0.3-0.3 0.5-2.2 0.8-3.3 0.9-4.2 1.8-8.4 2.6-12.6 1-5.2 2-10.3 2.7-15.5 1.2-9.3 1.9-18.7 2.1-28.1 0.2-7.4 0-14.8-0.8-22.2-0.8-7.6-3.2-21-4.1-22.7-2.1-9.6-5.1-18.7-9.7-27.1-6.3-11.7-14.7-22.3-24-31.8-7.5-7.7-16.6-13.6-25.4-19.8-9.4-6.6-19.2-12.6-29.2-18.4-9.5-5.5-19.4-10.3-29.1-15.5-5.6-3-12.2-6-16.7-8.9-1.7-1.1-3.3-2.1-3.6-2.1zm-274.8 74.1c-0.5 0-1 0.5-2.2 1.6-1.1 1-3.2 2.9-4.8 4.1-4.4 3.5-11.7 9.5-17.5 14.3-8 6.6-16 13-23.8 19.9-8.7 7.7-17.7 15.3-25.5 23.9-4.3 4.8-8.2 10-11.7 15.5-4.4 7-8.2 14.4-11.3 22.1-3 7.6-5.2 15.4-6.7 23.4-1.5 8.1-2.3 16.4-2.3 24.7 0 11.7 1.3 23.4 3.3 34.9 1.5 8.7 3.8 17.3 6.4 25.7 3.2 10 7.1 19.8 11.4 29.4 4.5 9.9 12.2 24.6 15.1 29 3.2 5.1 5.7 9.6 8.7 14.7 0.9 2 1.9 2.2 2.5 0.6 0.2-0.6 0.4-8.6 0.5-17.6 0-9.1 0-11.7 0.4-17.5 0.6-8.1 1.7-16.2 3.2-24.3 2.2-11.9 5-23.8 8.5-35.4 2.9-9.4 6.2-18.4 10.3-27.6 3.6-8.4 10-21 13.9-27.1 3.6-5.7 7.2-12.3 11.6-17.9 4.3-6.2 9.2-12.1 14.1-17.9 1.4-1.6 10.9-12.3 14.6-16.4 4-4.4 8.1-9.4 11.9-14.1 3-3.8 3.1-3.9 2.9-6.1-0.1-1.2-0.5-2.5-1-3-1.3-1.5-1.7-3.5-2.6-5.3-2.2-4.5-3-6.5-6.8-13.6-1.7-3.1-2-3.4-3.4-3.6-1.6-0.1-4.5 0.5-10.1 4.7-5.2 3.8-10.3 8.3-15.2 12.7-4.3 3.4-12.6 11.7-18.3 18.2-6.9 8-13.1 16.7-18.9 25.6-4.8 7.3-9 15.5-13.1 24-3.9 8.8-7.5 17.8-10.5 27-2.1 6.4-3.8 13-5.2 19.7-1.3 6-2.4 11.6-3.2 18.3-0.5 4-1.1 8.2-1.2 9.3-0.1 1.1-0.4 1.9-0.6 1.9-0.6 0-0.7-6-0.4-19.4 0.3-12.6 1.1-18.5 2.7-27.6 1.1-6.2 2.8-12.3 4.8-18.3 3-8.9 6.6-17.6 10.7-26 3-6.1 6.4-11.9 10.1-17.6 5.9-8.9 12.4-17.6 19.4-25.7 7.1-8.1 19.2-19.7 22.9-22.8 4.7-4 8.5-7.2 12.9-10.6 4.1-3.2 4.7-4 4.7-5.5 0-0.7-1.3-3.7-3.5-7.9-0.3-0.6-0.9-2-1.3-3-0.4-1-1.1-2.9-1.7-4.3-0.6-1.4-1.4-3.7-1.8-5.2-0.6-2.1-1.1-2.9-2-3.4-0.4-0.3-0.8-0.4-1-0.4zm265.4 0c-0.3 0-0.6 0.1-1 0.4-0.9 0.5-1.4 1.4-2 3.4-0.4 1.5-1.2 3.9-1.8 5.2-0.6 1.4-1.3 3.3-1.7 4.3-0.4 1-0.9 2.3-1.3 3-2.1 4.2-3.5 7.2-3.5 7.9 0 1.5 0.6 2.3 4.7 5.5 4.3 3.4 8.2 6.6 12.9 10.6 3.7 3.1 15.8 14.7 22.9 22.8 7 8.1 13.5 16.7 19.4 25.7 3.7 5.6 7.1 11.5 10.1 17.6 4.1 8.4 7.7 17.2 10.7 26 2 6 3.7 12.1 4.8 18.3 1.6 9.1 2.4 15 2.7 27.6 0.3 13.4 0.2 19.4-0.4 19.4-0.2 0-0.5-0.9-0.6-1.9-0.1-1.1-0.7-5.2-1.2-9.3-0.9-6.7-1.9-12.2-3.2-18.3-1.5-6.6-3.1-13.2-5.2-19.6-3-9.2-6.6-18.2-10.5-27-4.1-8.5-8.2-16.7-13.1-24-5.9-8.8-12-17.6-18.9-25.6-5.6-6.5-14-14.8-18.3-18.2-4.8-4.3-10-8.9-15.2-12.7-5.7-4.1-8.6-4.8-10.1-4.7-1.4 0.1-1.7 0.4-3.4 3.6-3.8 7.1-4.5 9-6.8 13.6-0.9 1.7-1.3 3.8-2.6 5.3-0.4 0.5-0.8 1.8-0.9 3-0.2 2.1-0.1 2.3 2.9 6.1 3.8 4.8 7.9 9.7 11.9 14.1 3.7 4.1 13.2 14.8 14.6 16.4 4.9 5.8 9.7 11.7 14.1 17.9 4.3 5.5 8 12.2 11.6 17.9 3.9 6.1 10.3 18.8 13.9 27.1 4 9.2 7.4 18.2 10.3 27.6 3.5 11.6 6.3 23.5 8.5 35.4 1.5 8 2.6 16.1 3.2 24.3 0.5 5.8 0.4 8.4 0.4 17.5 0 9.1 0.2 17 0.5 17.7 0.6 1.6 1.6 1.4 2.5-0.6 3-5.1 5.5-9.7 8.7-14.7 2.8-4.4 10.6-19.1 15.1-29 4.3-9.6 8.2-19.4 11.4-29.4 2.7-8.4 5-17 6.4-25.7 2-11.5 3.2-23.2 3.3-34.9 0-8.3-0.7-16.6-2.3-24.7-1.5-8-3.7-15.9-6.7-23.4-3-7.7-6.9-15.1-11.3-22.1-3.4-5.5-7.4-10.7-11.7-15.5-7.8-8.7-16.8-16.2-25.5-23.9-7.7-6.8-15.8-13.3-23.8-19.9-5.8-4.8-13.1-10.9-17.5-14.3-1.5-1.2-3.7-3.1-4.8-4.1-1.2-1.2-1.7-1.6-2.2-1.6zm-183.4 42c-0.9 0-0.9 0.2-0.7 3.3 0.2 2.7 0.7 4.1 2.6 7.9 1.6 3.1 2.8 5 4 5.9 1.9 1.5 10.2 5.7 16.8 8.5 8.7 3.6 10.1 4.2 16.2 7.2 3.4 1.7 6.7 3.8 7.7 4.5 1 0.6 1.4 2 1.4 3.4l0.1 9.7 0.2 8.5c0.1 1.2 0.1 2.2-1.2 3.5 0 0-2.3 2.1-3.5 3.1-4.5 3.7-8.7 7.8-13.8 10.5-4.5 2.4-9.4 4.6-14.5 4.9-5 0.3-8.4-0.7-14.6-3.1-2.6-1-5-1.7-5.4-1.6-0.9 0.4-2.5 5.9-2.5 8.9 0 5.3 2.5 10.9 6.3 14.5 1.4 1.4 3 2.4 3.5 2.4 0.7 0 4.8-4.8 7.4-6.9 5.7-4.4 11.4-9 18.1-11.6 7.1-2.8 14.1-4.1 22.5-4 0 0 0.1 0 0.1 0 0 0 0.1 0 0.1 0 8.5-0.1 15.4 1.2 22.5 4 6.7 2.6 12.4 7.2 18.1 11.6 2.7 2.1 6.8 6.9 7.4 6.9 0.6 0 2.1-1 3.5-2.4 3.8-3.6 6.3-9.3 6.3-14.5 0-3-1.6-8.6-2.5-8.9-0.4-0.1-2.8 0.6-5.4 1.6-6.2 2.4-9.6 3.4-14.6 3.1-5.1-0.3-10-2.5-14.5-4.9-5.1-2.7-9.3-6.8-13.8-10.5-1.2-1-3.5-3.1-3.5-3.1-1.2-1.3-1.2-2.2-1.2-3.5l0.2-8.5 0.1-9.7c0-1.4 0.4-2.7 1.4-3.4 1-0.6 4.3-2.8 7.7-4.5 6.1-3 7.5-3.6 16.2-7.2 6.6-2.8 14.9-6.9 16.8-8.5 1.1-0.9 2.4-2.8 4-5.9 1.9-3.8 2.4-5.2 2.6-7.9 0.3-3.1 0.2-3.3-0.7-3.3-0.5 0-2.4 1.3-4.2 2.8-1.8 1.6-4.4 3.4-5.9 4-2.5 1.1-3.1 1.2-10.2 1.2-6.3 0-7.7 0.1-8.7 0.8-2.9 1.9-10 4.4-14.5 5.1-2.9 0.5-5.1 0.7-7.3 0.7-2.2 0-4.4-0.2-7.3-0.7-4.5-0.7-11.6-3.2-14.5-5.1-1-0.7-2.4-0.8-8.7-0.8-7.1 0-7.7-0.1-10.2-1.2-1.5-0.6-4.1-2.4-5.9-4-1.8-1.6-3.6-2.8-4.2-2.8zm-29.3 10.1c-1.7 0-1.9 1.9 0.4 5.2 3 4.3 5.2 6.3 8.3 8.8 3.3 2.6 7 5.1 11 6.4 3.3 1.1 6.9 1 10.4 1.1 2.6 0 7.7-0.4 7.9-0.7 0.6-1-1-2-2.4-2.3-3.2-0.6-10.4-2-15.2-4.2-4.7-2.1-9.5-5.3-12.8-8.6-3.3-3.2-6.1-5.8-7.7-5.8zm-7.1 3.8c-0.3 0-0.6 0.2-0.9 0.5-0.6 0.6-0.5 1.2 1.3 5.2 3.3 7.6 6.9 13.1 12.3 17.9 3.5 3.1 8 5.4 12.6 6.5 5.4 1.3 10.1 0.6 16.7-0.3 4.7-0.6 10-1.4 15.1-1.4 4.2 0 11.6 1.3 12.6 1.3 1.7 0.1 1.8 0 2-1.1 0.1-1.2-1.3-2.4-5.7-4.8-5.2-2.8-12.2-3.5-20.4-2-5.9 1-14.8 1.3-18.1 0.6-8.6-2-14.6-6.7-23.1-18.2-2.2-3-3.3-4.2-4.3-4.1zm-7.5 23.2c-0.6 0-1.5 1.1-3.1 3-1.4 1.7-4.5 5.4-7.1 8.3-8.4 9.6-18.6 21.7-25.8 34.7-5 8.6-11.2 21.1-13 26-2.5 6.8-5.6 13.4-7.6 20.8-3.6 11.4-6.9 25-8.7 37.7-2.3 16.8-2.4 34.6-2.3 50.9 0.9 9.5 1.6 19.2 3.8 28.6 3.1 13.1 6.4 25.7 13 38.3 2.2 3.5 4.9 8.1 7.9 11.7 2.3 2.8 3.7 3.7 4.4 2.6 0.3-0.4-0.4-3.6-1.4-6.7-0.9-2.8-1.1-6-1.9-8.9-0.8-3.3-1.8-12.1-2.5-22.1-0.6-9 0.5-26.1 2.4-35 1.5-7.2 2.2-15.6 4.6-23.1 4-18.1 11.4-36.3 19.2-53 4.4-9.2 10.1-19.8 15.6-29.3 6.5-10.9 14.4-23.2 22.1-34 2-2.9 4.2-5.6 5.8-8.6-3.9-2.9-7.9-5.8-11.2-8.3-4.3-3.4-8-8.1-9.9-12.5-1.1-2.5-1.6-5.1-2.9-15.3-0.5-4.1-0.8-5.9-1.6-5.9zm189.3 0c-0.8 0-1 1.8-1.6 5.9-1.3 10.2-1.8 12.8-2.9 15.3-1.9 4.4-5.6 9.1-9.9 12.5-3.3 2.6-7.3 5.5-11.1 8.3 1.6 3 3.8 5.6 5.8 8.6 7.7 10.9 15.6 23.1 22.1 34 5.6 9.6 11.3 20.1 15.6 29.3 7.8 16.8 15.2 35 19.2 53 2.4 7.4 3.1 15.9 4.6 23.1 1.9 9 3 26.1 2.4 35-0.7 10-1.7 18.8-2.5 22.1-0.8 2.9-1 6-1.9 8.9-1 3.1-1.6 6.2-1.4 6.7 0.6 1 2.1 0.2 4.4-2.6 3-3.5 5.6-8.1 7.9-11.7 6.6-12.6 10-25.2 13-38.3 2.2-9.4 2.9-19.1 3.8-28.6 0-16.3 0-34.1-2.3-50.9-1.7-12.8-5.1-26.3-8.7-37.7-2-7.4-5-14-7.6-20.8-1.8-4.9-8-17.4-13-26-7.2-13-17.4-25.1-25.8-34.7-2.5-2.9-5.7-6.6-7.1-8.3-1.6-1.9-2.5-3-3.1-3zm-63.7 16.3c-1.4 0-2 0.6-2 1.8 0 1.3 11.5 6.3 16 6.9 3.8 0.6 7.7-0.2 12.3-2.2 5.8-2.6 7.3-3.6 7.3-4.9 0-1.6-0.8-1.6-5.2-0.3-3.3 1-5 1.2-9.3 1.2-6.7 0-12-0.6-15.8-1.8-1.3-0.4-2.4-0.6-3.2-0.6zm-98.6 49.1c-0.1 0-0.2 0.1-0.3 0.2-0.2 0.2-5.2 8.6-11.2 18.7-15.5 26.2-18.7 33.9-25.4 51.9-4.1 11.1-7.6 22.7-8.9 34.4-2.1 19.2-2.1 39.1 2.1 58 3.7 16.8 6.6 27 20.2 47.5 3.4 5.1 5.4 7.4 8.7 10.7 0.3 0.3 0.7 0.6 1.2 0.6 1.5 0 1-1 0.8-2.4-1.2-9.9-1.7-34.9-1.2-57.9 0.5-22.1 2.2-45.4 5.2-67.9 1.9-13.9 4.9-27.6 8.1-41.4 1.8-6.9 5.8-21.1 9.4-32.7 1.3-4.4 1.4-4.1-3-11.9-3.5-6.1-4.8-8.1-5.7-7.9zm135.2 0c-0.9 0.1-2.3 2.2-5.5 7.9-4.4 7.8-4.3 7.5-3 11.9 3.6 11.6 7.6 25.7 9.4 32.7 3.2 13.7 6.2 27.4 8.1 41.4 3 22.5 4.7 45.8 5.2 67.9 0.5 23.1 0 48.1-1.2 57.9-0.2 1.4-0.6 2.4 0.8 2.4 0.4 0 0.9-0.3 1.2-0.6 3.3-3.3 5.3-5.6 8.7-10.7 13.6-20.5 16.5-30.7 20.2-47.5 4.2-18.9 4.2-38.8 2.1-58-1.3-11.8-4.8-23.3-8.9-34.4-6.7-18.1-9.8-25.7-25.4-51.9-5.9-10.1-11-18.4-11.2-18.7-0.2-0.2-0.3-0.2-0.5-0.2zm-109 24.6c-0.3 0-0.7 0.7-1.1 1.5-3.7 8.4-5.8 16.7-7.8 25.3-2.3 9.8-3.6 19.9-4.9 30-0.9 7.1-0.8 5.3-1.9 21.4-0.7 10.4-0.6 14.4 0.6 26 0.9 8.9 1.5 11.7 2.9 17.4 1.6 6.5 3.2 12.9 6.5 19 4.5 8.7 11.7 16.9 19.9 22.6 1.8 1.3 3.7 2.3 4.3 2.3 1.3 0 1.6-0.8 0.9-2.7-0.5-1-0.8-1.9-1.2-2.8-2.7-7.8-4.6-15.8-6.6-23.7-1.6-6.4-2.9-12.8-4.2-19.2-1.2-6.1-2.3-12.2-3.2-18.3-1-7.1-2-14.1-2.5-21.2-0.8-12.3-1.3-27.1-1.5-40.4-0.1-11.6 0-22.1 0.5-28.8 0.4-5.9 0.2-8.2-0.8-8.2zm83 0c-1 0-1.2 2.3-0.8 8.2 0.5 6.8 0.6 17.3 0.5 28.8-0.2 13.3-0.7 28.1-1.5 40.4-0.5 7.1-1.4 14.2-2.5 21.2-0.9 6.1-2 12.2-3.2 18.3-1.3 6.4-2.6 12.8-4.2 19.2-2 8-3.9 16-6.6 23.7-0.3 1-0.7 1.8-1.2 2.8-0.7 1.8-0.4 2.7 0.9 2.7 0.5 0 2.5-1 4.3-2.3 8.3-5.8 15.5-14 19.9-22.6 3.3-6.1 4.9-12.5 6.5-19 1.4-5.7 2-8.5 2.9-17.4 1.2-11.6 1.3-15.6 0.6-26-1.1-16.1-1-14.3-1.9-21.4-1.3-10-2.5-20.1-4.9-30-2-8.6-4.1-16.9-7.8-25.3-0.3-0.8-0.8-1.5-1.1-1.5zm-44.1 5.9c-13.8 0-14.7 0.1-15.2 0.9-0.7 1 0.2 15.1 0.5 22.7 0.3 8 0.9 16.1 1.4 24.1 0.6 8.7 1.2 17.3 2.2 26 0.8 7.4 1.4 14.8 3.1 22 1.5 6.7 3.8 13.2 6.3 19.6 1.2 3.1 3.3 8.3 4.3 9.1 1-0.9 3.1-6 4.3-9.1 2.5-6.4 4.8-12.9 6.3-19.6 1.7-7.2 2.3-14.6 3.1-22 1-8.6 1.5-17.3 2.2-26 0.6-8 1.1-16.1 1.4-24.1 0.3-7.6 1.2-21.7 0.5-22.7-0.5-0.8-1.4-0.8-15.2-0.9-1.3 0.1-2 0.1-2.6 0.1-0.7 0-1.3 0-2.6-0.1z">
<animate id="p1"
attributeName="stroke-dashoffset"
begin="0.1s;f1.end+0.4s"
values="2037;0;2037"
dur="15s"
calcMode="linear"
/>
<animate id="f1"
attributeName="fill"
begin="p1.end+0.4s"
dur="10s"
values="#FCFCFC;#A9A9A9;black;#A9A9A9;#FCFCFC"
/>
</path>
</g>
</svg>
</div>
<div class="txt">
<p> The lion (Panthera leo) is a species in the family Felidae; it is a muscular, deep-chested cat with a short, rounded head, a reduced neck and round ears, and a hairy tuft at the end of its tail. The lion is sexually dimorphic; males are larger than females with a typical weight range of 150 to 250 kg (330 to 550 lb) for males and 120 to 182 kg (265 to 400 lb) for females. Male lions have a prominent mane, which is the most recognisable feature of the species. A lion pride consists of a few adult males, related females and cubs. Groups of female lions typically hunt together, preying mostly on large ungulates. The species is an apex and keystone predator, although they scavenge when opportunities occur. Some lions have been known to hunt humans, although the species typically does not.</p>
<p>Typically, the lion inhabits grasslands and savannas but is absent in dense forests. It is usually more diurnal than other big cats, but when persecuted it adapts to being active at night and at twilight. In the Pleistocene, the lion ranged throughout Eurasia, Africa and North America but today it has been reduced to fragmented populations in Sub-Saharan Africa and one critically endangered population in western India. It has been listed as Vulnerable on the IUCN Red List since 1996 because populations in African countries have declined by about 43% since the early 1990s. Lion populations are untenable outside designated protected areas. Although the cause of the decline is not fully understood, habitat loss and conflicts with humans are the greatest causes for concern.</p>
<p>One of the most widely recognised animal symbols in human culture, the lion has been extensively depicted in sculptures and paintings, on national flags, and in contemporary films and literature. Lions have been kept in menageries since the time of the Roman Empire and have been a key species sought for exhibition in zoological gardens across the world since the late 18th century. Cultural depictions of lions were prominent in the Upper Paleolithic period; carvings and paintings from the Lascaux and Chauvet Caves in France have been dated to 17,000 years ago, and depictions have occurred in virtually all ancient and medieval cultures that coincided with the lion's former and current ranges.is not fully understood, habitat loss and conflicts with humans are the greatest causes for concern. </p>
wikipedia.org
</div>
</body>
答案 1 :(得分:1)
我找到了答案。您将<animate />
标记插入路径。
<path stroke-dashoffset="200" stroke-dasharray="200 30" stroke-width="2" stroke="#333" d="...">
<animate attributeName="stroke-dashoffset" values="0 2000" dur="5s" repeatCount="indefinite" />
</path>