Mastering CSS

Explore applying styles with inline styles, head-level style blocks, and external style sheets, and master selectors, image float, padding, borders, visibility, and how these affect page layout.

Explore how to style text using CSS, covering color options (named, rgb, hex), alignment, decoration, transforms, indentation, spacing, shadows, and fonts (family, style, weight, size with em).

Master the css box model by understanding how elements sit inside a box, and use width, height, padding, border, and margin to control layout with pixels and percent values.

Learn CSS positioning concepts: static, relative, absolute, and fixed, through two orange and blue boxes and demonstrations of how each position affects layout and scrolling.

Explains responsive design fundamentals using a viewport tag, a CSS reset, and a multi-breakpoint layout that shifts from single to two to three columns across mobile, tablet, and desktop.

Explore CSS transitions and transformations to animate images with hover effects, scaling, rotating, and fading, demonstrated on a real estate gallery with clickable thumbnails that swap the featured image.

Explore css animation and sprite sheets by building a walking character on a scrolling ocean background, using two divs, six-frame sprites, keyframes, linear easing, and infinite looping.