HTML Academy
  • HTML Academy
  • Courses
  • Courses
  • Pricing
  • For schools
  • Advanced Courses
    • Regular expressions
    • Template Engine
    • Design systems
    • CSS-animation
    • Algorithms and Data Structures
    • TypeScript, part 1. Type theory
  • Sign up
  • Log in
  • Home
  • Interactive courses
  • SVG basics
  1. An Introduction to SVG beta 0/15
  2. Designing SVG Shapes beta 0/20
  3. Dimensions in SVG beta 0/15

Chapter 3: Dimensions in SVG

11 tasks and  4 challenges   beta

We will delve into how SVG graphics are scaled and learn how to work with the viewBox and preserveAspectRatio attributes.

Get access
SVG Width and Height Task
The viewBox Attribute Task
viewBox and Dimensions Task
Challenge: Fish Challenge
The preserveAspectRatio Attribute Task
Flexible Background with preserveAspectRatio Task
Challenge: Flexible Margins Challenge
Alignment in preserveAspectRatio Task
preserveAspectRatio and viewBox Task
Filling the Space Task
Challenge: Rainbow Challenge
Units Task
Coordinate systems Task
Coordinate Systems and Transforms Task
Challenge: Yellow Leaf Challenge

Cookies ∙ Privacy ∙ License Agreement ∙ About ∙ Contacts ∙ © HTML Academy OÜ, 2019−2022

VISAMastercard

Log in

or

Forgot your password?

Sign up

Sign up

or
Log in

Restore access

Have you forgotten your password or lost access to your profile? Enter your email connected to your profile and we will send you a link to restore access.

Forgot to connect your email to the profile? Email us and we’ll help.

We are using cookies to gather information which will help you use our website most effectively. You can read about this here or disable this feature if you want. By continuing to browse the site, you agree to our use of cookies.