Web Unleashed 2017

2017-09-25 00:00:00 2017-09-27 00:00:00 America/Toronto Web Unleashed 2017 Drive your career to the forefront by learning the latest tools, techniques and technologies in front-end web development. Toronto FITC Toronto

Presentation

Add to My Schedule Remove From Schedule Slides
A Tale of Four Properties

September 25 2017, 9:30 - 10:15am Room: Salon AB & Salon CD

Animation
Creative Code
CSS

Overview

You can make shapes in HTML and CSS. Sometimes it involves some trickery, like exploiting how borders connect to make a triangle, extreme border-radius to make circles, or layering pseudo elements and transforms to make more complex shapes.

But there are also some shape functions right in CSS. Things like circle(), polygon(), and path(). But where can you use them? And how? And for what? That’s exactly what Chris will be looking at in this talk. He’ll have some fun building a fan site and using four different shape-related properties in CSS.

Objective

To let folks know about some newish CSS properties, what they are capable of, and what to watch out for.

Target Audience

Front-end designers and developers

Assumed Audience Knowledge

Basic knowledge of HTML, CSS, and the concept of design.

Five Things Audience Members Will Learn

  1. What shape-outside is for and how to use it
  2. What offset-path is for and how to use it
  3. What clip-path is for and how to use it
  4. The fact that you can change some SVG shapes right in CSS
  5. How to animate many of these things