Skip to content
Educora
EN
AzərbaycancaEnglishРусскийTürkçe
My learningEducora StudioSettings

HTML & CSS

Structure and design of web pages

Learn to build web pages from scratch: understand how the web works, structure text, lists, tables, links, images and forms with HTML, and make pages accessible to everyone with semantic elements. Then give them a great look with CSS: selectors, the cascade, the box model, Flexbox, Grid, responsive design, animations and variables. Every example runs live in your browser, so you see the result of each change at once.

10 lessons4 modules≈ 3.1 hBeginnerIntermediateAdvanced
Progress0%

0 of 10 lessons completed

Start course

How the web works: your first HTML page

Course content

All tests · 10Formulas & shortcuts
1

HTML basics

Beginner

Find out how the web works and write your first pages with text, lists, tables, links and images.

3 lessons
  1. 1How the web works: your first HTML pageFind out what happens when you open a website, and write your first HTML page with tags, elements and attributes.
  2. 2Text, lists and tablesStructure text with headings and paragraphs, highlight what matters and organize information in lists and tables.
  3. 3Links and imagesConnect pages with links, jump around within a page and add images with meaningful alternative text.
2

Forms and semantic HTML

Beginner

Build forms that collect information from users and make your pages clear to people and screen readers alike.

2 lessons
  1. 4Forms and inputsBuild forms with labels, the right field types and built-in validation that checks data before it is sent.
  2. 5Semantic HTML and accessibilityUse elements that describe what content means, and make your pages usable for everyone, including screen reader users.
3

CSS fundamentals

Intermediate

Control how a page looks with selectors, colors, fonts, the cascade and the box model.

2 lessons
  1. 6CSS basics: selectors, colors, fonts and the cascadeLearn how CSS rules are written, pick elements with selectors, set colors, units and fonts, and understand which rule wins when rules collide.
  2. 7The box modelLearn that every element is a box of content, padding, border and margin, calculate sizes correctly and make life easier with `box-sizing`.
4

Layout and modern CSS

Advanced

Build pages that adapt to any screen with Flexbox and Grid, and bring them to life with transitions, animations and CSS variables.

3 lessons
  1. 8Flexbox: laying things out in a lineUse Flexbox to line elements up in a row or column, share the space between them, center them and let them adapt to the space available.
  2. 9CSS Grid and responsive designBuild page layouts from rows and columns with CSS Grid, and adapt them to any screen with media queries and a mobile-first approach.
  3. 10Transitions, animations and CSS variablesKeep colors and sizes in CSS variables, and bring pages to life with smooth transitions and `@keyframes` animations — without forgetting users who are sensitive to motion.

Coding

PythonThe most popular first language: simple, powerful, versatileJavaScriptThe language of the web — interactive sites and appsTypeScriptSafe, scalable JavaScript with typesSQLThe language for talking to databases