SVG
可缩放矢量图形与可视化
- 001入门SVG 概述与环境配置SVG 发展历程、核心特性、与 Canvas/位图对比、嵌入方式与开发环境。
- 002入门SVG 基础语法与文档结构svg 根元素、命名空间、defs/metadata/title、嵌套与分组。
- 003入门SVG 坐标系与 viewBox视口、viewBox、preserveAspectRatio、坐标系变换原理与适配技巧。
- 004入门SVG 基本图形详解rect、circle、ellipse、line、polyline、polygon 六大基本图形属性与用法。
- 005中级SVG 路径 path 详解path 命令、贝塞尔曲线、弧线、相对坐标与复杂路径绘制技巧。
- 006中级SVG 文本与排版text、tspan、textPath、文字锚点、字体属性与可访问文本。
- 007中级SVG 颜色与填充fill、stroke、opacity、currentColor、paint-order 与矢量效果。
- 008中级SVG 渐变与图案linearGradient、radialGradient、pattern 平铺与复杂纹理。
- 009中级SVG 变换 transformtranslate、rotate、scale、skew、matrix 与 transform-origin 变换组合。
- 010进阶SVG 滤镜详解filter、feGaussianBlur、feDropShadow、feColorMatrix、滤镜组合与光照。
- 011进阶SVG 裁剪与蒙版clipPath 硬裁剪、mask 软蒙版、 luminance 与 alpha 蒙版技巧。
- 012中级SVG 符号与复用symbol、use、defs 复用机制与图标系统构建。
- 013进阶SVG 动画基础SMIL animate、animateTransform、animateMotion 与 CSS 动画对比。
- 014中级SVG CSS 样式化内联样式、style 标签、外部 CSS、CSS 变量、伪类与媒体查询。
- 015进阶SVG JavaScript 交互DOM 操作、事件绑定、属性读写、动态生成与数据驱动可视化。
- 016进阶SVG 响应式与性能响应式适配、性能瓶颈、优化策略、懒加载与压缩。
- 017中级SVG 图标与可访问性图标系统设计、aria 属性、屏幕阅读器支持与无障碍最佳实践。
- 018进阶SVG 实战项目综合运用：仪表盘、环形进度、动画 Logo、数据可视化。