Web Development Course:
CSS offset property
offset property allows you animate an element by defining a specific path. It is an experimental property, so always check the browser support info.
offset is a shorthand for five subproperties:
All of them can also be used individually. However, the subproperties are experimental as well.
Syntax and property values
As all shorthands in CSS,
offset requires you to list the values for each subproperty in a row:
offset: path distance rotate anchor;
The subproperties and their values are explained in the table below.
||Defines the point traveling along the path in keywords, length units, percentages or edge offset values|
||Defines the element's position in the path in percentages|
||Defines the motion path in SVG coordinates|
||The initial position of the element|
||Defines the element's orientation in the path in angles|
Note: in its early versions, the
offsetCSS property was also called
Mobile browser support
A Sorted List of CSS Code Examples: Master Styling HTML Elements
Easily accessible CSS code examples: CSS styles, borders, tables, buttons & more. Discover many CSS examples in this comprehensive CSS code example list.
A Complete Tutorial to Master Styling Properties of CSS Outline
Easiest way of using CSS outline to make your text stand out. CSS text outline examples so you can learn to use CSS outline easily in your styling markup.