HTML & CSS
✦ PROType real markup and style sheets: HTML5 elements, CSS selectors, colours, transforms and animations, then forms, flexbox, grid and responsive design.
HTML document
The doctype, head and the body of an HTML5 page.
Sectioning elements
section, headings, article, nav, details and form.
Embedded content
figure, picture, audio and video.
Text-level elements
time, mark and abbr inside a paragraph.
CSS selectors
Attribute selectors, pseudo-classes, pseudo-elements and combinators.
CSS colors
Hex, rgb, rgba, hsl and hsla colour values.
CSS units and calc()
Length units and calc() expressions.
CSS media queries
@media rules for screen sizes and orientation.
CSS transforms
translate, rotate, scale, 3D transforms and perspective.
CSS transitions
The transition shorthand with timing functions and delays.
CSS animations
The animation shorthand and @keyframes rules.
HTML Boilerplate & Head
Practice typing the HTML document structure and head elements.
Semantic Elements
Type semantic HTML5 elements for accessible page structure.
Forms & Inputs
Practice typing form elements with attributes and validation.
CSS Selectors & Properties
Type CSS selectors, properties, and values.
Flexbox Layout
Practice CSS Flexbox properties for one-dimensional layouts.
Grid Layout
Type CSS Grid properties for two-dimensional layouts.
CSS Animations & Transitions
Practice CSS transitions, transforms, and keyframe animations.
Responsive Design & Media Queries
Type media queries and responsive design patterns.
The Typing Cat is rated 4.1 out of 5 from 97,327 ratings