CSS Learn CSS Quick Start Course for Beginners Web Design

Learn the basics of css, apply styling to pages, understand selectors and syntax, work with colors, fonts, backgrounds, and practice with exercises to build a styled site.

Install and start Visual Studio Code as your code editor, download from the site, switch from brackets, customize colour themes, open files and folders, and run a local live server.

Learn the basics of setting up and experimenting with cascading style sheets (CSS) using browser developer tools and Brackets, creating a simple HTML structure, and preparing for applying CSS.

Learn how CSS styles web pages by applying inline style attributes, style tags, and external style sheets, and understand color, background color, selectors, and cascade order to control element appearance.

Discover how to style with CSS colors, using named colors, hex values, RGB/RGBA with transparency, and HSL, plus tools like a color generator and Brackets color picker.

Learn how css selector syntax targets elements with tag, class, and id selectors, and apply declarations like color and background using a declaration block, with practical exercises on h2 elements.

Explore the CSS box model and learn how border, padding, and margin shape elements like divs and headings. Practice using shorthand, units, and dev tools to build responsive layouts.

Learn CSS background image options using local or web URLs, manage colors, sizing, and image repetition (no-repeat, repeat-x, repeat-y), and control attachment and positioning to refine how images appear.

Learn how pseudo classes and pseudo selectors change element states, with hover, visited, focus, and active examples on h1, links, padding, and borders, using dev tools for testing.

Explore the display property to control how elements render, comparing block and inline behavior of divs and spans, and learn how display none, visibility hidden, and inline-block affect layout.

Learn CSS position properties by applying static, relative, fixed, absolute, and sticky to divs and spans, adjust left and top, and observe how elements move or stay in place.

Learn how the CSS float property positions elements to left or right and how clear prevents wrapping, with examples using images, text, and multiple columns.

Target multiple elements with nested selectors and comma-separated lists, applying the same properties to matching divs with a specific class and using fine-tuned, precise selections to set a blue background.

Explore how fonts influence content presentation and learn to apply font families such as cursive, fantasy, sans serif, and serif, and to import or link Google fonts into CSS.

Explore common CSS techniques for a 75% main and 25% side column using floats and box-sizing border-box. Learn to align text, style lists, and use pseudo elements like ::after.

Learn to transform a basic web template by applying CSS styling to the body, header, and navigation, including fonts from Google and hover effects.

Learn to build a two-column webpage with a right side menu and a footer by floating the main content, using 75 percent and 25 percent widths, and box-sizing border-box.