2015
Digital Tutors
Gary Simon
1:34
English

Throughout these Illustrator and CSS tutorials, you'll learn how to make SVG (Scalable Vector Graphics) responsive. We'll first step inside of Adobe Illustrator to design custom SVGs for our project.
Next, we'll export the SVGs and, through HTML and CSS, you'll learn how to manipulate the SVGs based on media queries. By the end of the Illustrator and CSS training, you'll understand how to make the SVGs interactive with hover and click events.

1 Introduction and project overview Watch it now
2 Designing the first icon
3 Replicating the icon for two different sizes
4 Creating the HTML document
5 Making the layout responsive with CSS
6 Making the SVG responsive with CSS
7 Designing a 'satisfaction guaranteed' emblem
8 Designing the center of the emblem
9 Replicating the emblem for two different sizes
10 Writing the HTML and CSS
11 Making the emblem responsive
12 Making the SVG interactive with hover effects
13 Making the SVG interactive on mouse click

http://www.digitaltutors.com/

Download File Size:351.08 MB

---