Thank you for sending your enquiry! One of our team members will contact you shortly.
Thank you for sending your booking! One of our team members will contact you shortly.
Course Outline
Introduction
Overview of Scalable Vector Graphics
- Understanding Vector Graphics
- SVG Fundamentals
- SVG Uses and Applications
Learning the Basics of Using SVG
- Creating an SVG
- Using SVG as Images
- Creating an SVG Image
Digging Deep into SVG Code
- Understanding the SVG Layout, Structure, and Attributes
- Introduction to SVG Elements
- Working with SVG Graphical Elements
- Working with SVG Container Elements
- Working with SVG Gradient Elements
Using SVG with HTML & CSS
- Embedding SVG
- Modifying and Styling SVG Using CSS
- Making SVG Responsive
Creating SVG Sprites
- Overview of Image Sprites
- Using HTML Inline SVG Sprites
- Referencing External SVG Sprites in HTML
- Using CSS Inline SVG Sprites
- Using SVG Fragment Identifiers
Optimizing SVG
Animating with SVG
- Using CSS for SVG Animation
- Using SMIL for SVG Animation
- Using JavaScript for SVG Animation
Creating Your First SVG Logo Animation Project
- Setting Up Your Work Environment
- Drawing the SVG
- Modifying the SVG Code to Style the SVG
- Optimizing the SVG
- Animating the SVG
Troubleshooting
Closing Remarks
Requirements
- Background in HTML & CSS
7 Hours
