<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>HTML5 SVG草莓图案特效 - 【更多源码：www.96flw.com】</title>
<style>
body {
display: grid;
place-content: center;
margin: 0;
height: 100vh;
background: #e7e7e7;
}
svg {
width: 55vmin;
height: 68vmin;
margin:0 auto;
}
</style>
</head>
<body>
<svg viewBox='0 0 550 680'>
<radialGradient id='g'>
<stop stop-color='#bbb'/>
<stop stop-color='#bbb' stop-opacity='0' offset='.9'/>
</radialGradient>
<path d='M0 654v26h550v-26z' fill='url(#g)'/>
<path d='M0 310l66 39-5-87' fill='#e7474f'/>
<path d='M0 310l37 113 29-76' fill='#e9a1a5'/>
<path d='M24 200l93 4-20-80' fill='#c11718'/>
<path d='M24 200l93 4-56 58' fill='#e64034'/>
<path d='M24 200l37 62-61 48' fill='#db111a'/>
<path d='M37 423l160 196-36-137' fill='#db111a'/>
<path d='M66 347l81-5-86-80' fill='#de1b29'/>
<path d='M66 347l95 135-14-140' fill='#d7253b'/>
<path d='M66 347l-29 76 124 59' fill='#e26f76'/>
<path d='M97 124l-58-37 69 28' fill='#958447'/>
<path d='M97 124l11-9 44 26' fill='#a26d1f'/>
<path d='M117 204l35-63-55-17' fill='#b6191f'/>
<path d='M117 204l90-43-55-20' fill='#da0d1a'/>
<path d='M117 204l200-8-110-35' fill='#d41819'/>
<path d='M117 204l-56 58 86 80' fill='#e61019'/>
<path d='M117 204l30 138 170-146' fill='#e93852'/>
<path d='M147 342l182 133-59-122' fill='#cd141a'/>
<path d='M147 342l14 140 168-7' fill='#de1730'/>
<path d='M152 141l-44-26h74' fill='#667019'/>
<path d='M152 141l30-26 46 18' fill='#7b7c1a'/>
<path d='M161 482l115 85 53-92' fill='#dd4154'/>
<path d='M161 482l36 137 79-52' fill='#df3538'/>
<path d='M171 94l-48-43h-56' fill='#8fa247'/>
<path d='M171 94l-104-43 42 42' fill='#9bba30'/>
<path d='M171 94l-62-1 50 13' fill='#8ea746'/>
<path d='M197 619l168 11-89-63' fill='#dd1c25'/>
<path d='M197 619l69 48 99-37' fill='#dd3c4a'/>
<path d='M207 161l21-28 3-42 15-24 21 79' fill='#b9ca56'/>
<path d='M207 161l21-28-76 8' fill='#ae1a18'/>
<path d='M207 161l110 35-5-35' fill='#b41e16'/>
<path d='M207 161h105l-84-28' fill='#bb221b'/>
<path d='M228 133l-69-27 25-25' fill='#6a7b2a'/>
<path d='M228 133l-44-52 58 10' fill='#7a761d'/>
<path d='M228 133l14-42 25 55' fill='#6c5f19'/>
<path d='M266 667h47l52-37' fill='#af1b1c'/>
<path d='M267 146l-21-79 43 33' fill='#d8d534'/>
<path d='M267 146l22-46 23 61' fill='#778414'/>
<path d='M312 161l-37-101 59 30' fill='#616e1e'/>
<path d='M312 161l22-71 30 35' fill='#645a1f'/>
<path d='M312 161l52-36 37 7' fill='#8b6611'/>
<path d='M317 196l84-64-89 29' fill='#c21718'/>
<path d='M317 196h137l-53-64' fill='#e21218'/>
<path d='M317 196l114 68 23-68' fill='#e2201c'/>
<path d='M317 196l85 155 29-87' fill='#df1a2e'/>
<path d='M317 196l-47 157 132-2' fill='#d1141a'/>
<path d='M317 196l-170 146 123 11' fill='#e2070d'/>
<path d='M329 475l-59-122 132-2' fill='#dd2944'/>
<path d='M329 475l73-124 50 102' fill='#e14455'/>
<path d='M329 475l123-22-71 90' fill='#c6181a'/>
<path d='M329 475l52 68-105 24' fill='#e03b4c'/>
<path d='M377 69l50-18 21-51' fill='#92bb37'/>
<path d='M377 69l71-69-47 24' fill='#a2a93e'/>
<path d='M377 69l-8-24-26 55' fill='#b3c33d'/>
<path d='M377 69l-34 31 21 25' fill='#dcc460'/>
<path d='M381 543l65-9 6-81' fill='#e65b6e'/>
<path d='M381 543l-16 87 81-96' fill='#d77574'/>
<path d='M381 543l-105 24 89 63' fill='#e24c52'/>
<path d='M401 132l-37-7 13-56' fill='#5d4f14'/>
<path d='M401 132l-24-63 50-18' fill='#706d28'/>
<path d='M401 132l26-81 39 24' fill='#4d5524'/>
<path d='M452 453l-6 81 69-121' fill='#eca4ac'/>
<path d='M452 453l63-40-25-87' fill='#e36173'/>
<path d='M452 453l38-127-88 25' fill='#d30e16'/>
<path d='M454 196l41-41-94-23' fill='#d42423'/>
<path d='M454 196l96 58-55-99' fill='#df1e17'/>
<path d='M454 196l-23 68 119-10' fill='#e63732'/>
<path d='M490 326l25 87 35-159' fill='#d05c57'/>
<path d='M490 326l60-72-119 10' fill='#d11615'/>
<path d='M490 326l-59-62-29 87' fill='#d40f18'/>
<path d='M26 255l8-2v21
M113 270h-8v19
M128 371l-8 5 5 19
M143 489l-8 3 3 21
M189 231l-14 4 4 19
M202 412h-10l5 21
M260 295l-13 12 5 19
M273 514h-10l5 21
M340 393l-10-7 1 21
M348 308h8l-4 21
M397 428l9-9-4 25
M412 213l10-2-5 21
M446 382v-21h10
M495 279h-10l4 20' fill='#deb237'>
</svg>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器：360、FireFox、Chrome、Opera、傲游、搜狗、世界之窗. 不支持Safari、IE8及以下浏览器。</p>
<p>更多源码：<a href="http://www.96flw.com/" target="_blank">www.96flw.com</a></p>
</div>
</body>
</html>
HTML5 SVG草莓图案特效.zip
82 浏览量
2023-11-02
22:58:55
上传
评论
收藏 2KB ZIP 举报
HTML5 SVG草莓图案特效.zip （1个子文件） 
jiaoben6608 
index.html 5KB资源评论
码云笔记
- 粉丝: 2w+
- 资源: 5851
