SVG的和通过“定义一次、多次引用”实现图形复用，不复制数据仅复用渲染指令；存放带id的可复用元素，通过href引用并支持定位缩放；推荐用+构建图标系统，更规范可控。
SVG 的 是实现图形复用的核心机制，本质是“定义一次，多次引用”，不复制实际图形数据，只复用渲染指令，节省代码体积且便于统一维护。
用 定义可复用的图形
id，后续才能被引用。
例如：
svg width="200" height="100">用
通过 xlink:href（旧标准）或 href（现代标准）指向 id，把该图形“画出来”。你可以自由设置位置（x、y）、缩放（配合 transform）、颜色（部分属性可继承或覆盖）等。
注意： 引用的是“定义”，不是副本 —— 修改 实例会同步更新。
jQuery_CSS3适应手机端的Tab菜单页面切换插件
下载
今天给大家分享一款设计和精致的jQuery Tab页面切换插件，它的样式风格与传统的Tab切换不同，首先Tab标签使用的是小图标模式，就像一个按钮一样。另外，在切换tab时，tab标签的样式也很有特点，是一个凸起的弧形，给人3D立体的视觉效果。同时切换tab时背景颜色还可以自动切换。
例如（接上例）：
推荐搭配 +
对于图标类复用，更规范的做法是用 viewBox。它天然支持独立坐标系和尺寸控制，避免手动计算偏移。
-
根下，不能直接渲染 -
引用width/height缩放，x/y定位，且不受原始viewBox影响 - 示例：
注意事项和常见问题
-
href值必须带#，如href="#dot"；写成href="dot"会失效 - 跨文件引用需用完整 URL，如
href="icons.svg#dot"（需同源且浏览器支持） -
无法直接修改内部子元素样式（如改stroke），但可通过 CSS 类、CSS 变量或fill/stroke属性继承来间接控制 - IE 不支持
href，需回退用xlink:href（兼容写法：xlink:href="#dot" href="#dot"）
基本上就这些。合理组织 ，能让 SVG 更轻量、更易维护，尤其适合图标库、数据图表中的重复元素。
