Thursday, April 30, 2020

Using SVG with CSS3 and HTML5

Using SVG with CSS3 and HTML5: Supplementary Material 




[Example code and online extras for the O'Reilly Media book by Amelia Bellamy-Royds, Kurt Cagle, and Dudley Storey]

Chapters

Read a summary of each chapter, and find the code for each example and figure:

Part I: SVG on the Web
Graphics from Vectors: An Overview of SVG
The Big Picture: SVG and the Web
A Sense of Style: Working with CSS
Tools of the Trade: Software and Sources to Make SVG Easier

Part II. Drawing with Markup
Building Blocks: Basic Shapes
Following Your Own Path: Custom Shapes
The Art of the Word: Graphical Text Layout and Fonts

Part III. Putting Graphics in Their Place
Scaling Up: Defining Coordinate Systems
A New Point of View: Cropping Embedded SVG Files
Seeing Double: Re-using Content
Transformative Changes: Coordinate System Transformations

Part IV. Artistic Touches
Filling Up To Full: The fill Property, Gradients, & Patterns
Drawing the Lines: Stroke Effects
Marking the Way: Line Markers
Less Is More: Clipping and Masking
Playing with Pixels: Filters and Blend Modes

Part V. SVG as an Application
Beyond the Visible: Metadata for Accessibility and Added Functionality
Drawing on Demand: Interactive SVG
Transitioning in Time: Animation
Good Manners: Best Practices for SVG


No comments:

Post a Comment