SVG & Sprite & symbol & use

SVG & Sprite & symbol & use

https://www.zhangxinxu.com/sp/svgo/

https://www.zhangxinxu.com/study/201407/svg-sprite.php

https://www.zhangxinxu.com/wordpress/2019/08/css-no-external-link/

https://css-tricks.com/svg-symbol-good-choice-icons/

<svg>
  <defs>
    <g id="shape-icon-1">
      <!-- all the paths and shapes and whatnot for this icon -->
    <g>
    <g id="shape-icon-2">
      <!-- all the paths and shapes and whatnot for this icon -->
    <g>
  </defs>
</svg>


<svg class="icon" viewBox="214.7 0 182.6 792">
  <use xlink:href="#shape-icon-1" />
</svg>

<svg class="icon" viewBox="0 26 100 48">
  <use xlink:href="#shape-icon-2" />
</svg>

https://css-tricks.com/svg-sprites-use-better-icon-fonts/

https://www.npmjs.com/package/svg-sprite

svg & use

https://codepen.io/webgeeker/pen/KKwKwOG?editors=1010

refs

---

---

©xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

---