Project on Github: https://github.com/dev-planet-germany... Visual Studio Code: https://code.visualstudio.com/download Google Chrome: https://www.google.com/intl/de_de/chr... Texts for the project: https://raw.githubusercontent.com/dev... Background texture: https://raw.githubusercontent.com/dev... Pikachu image: https://raw.githubusercontent.com/dev... Pokeball image: https://raw.githubusercontent.com/dev... Pokéwiki for Pikachu: https://www.pokewiki.de/Pikachu In a time when almost everything is digital, almost everyone comes to the point where they want to create a website. If you want to do it all yourself, you can't avoid HTML & CSS and that's why this video tells you everything you need to know to create a static website using HTML and CSS. 00:00:00 Intro 00:00:20 Why learn HTML & CSS? 00:01:00 Course overview 00:02:15 Required programs 00:02:38 Visual Studio Code 00:02:55 Switching VSC to German 00:04:40 Google Chrome 00:05:00 What is HTML? 00:05:40 Creating an HTML file 00:07:15 The HTML basic structure 00:13:45 The abbreviation for the basic structure 00:14:45 HTML attributes 00:16:05 Setting the language - the lang attribute 00:17:10 Inserting text 00:18:10 Headings in HTML (h tags) 00:19:55 Paragraphs in HTML (p tags) 00:21:30 Autoformatting 00:22:50 Images in HTML (img tags) 00:27:35 Sections in HTML (section tags) 00:29:03 Tables in HTML 00:34:35 Block-level elements and inline elements 00:36:11 Lists in HTML 00:38:00 What is CSS? 00:38:35 The style attribute 00:39:45 The style tag 00:40:27 External CSS (The right way) 00:41:10 Creating a CSS file 00:42:24 The structure of a CSS assignment 00:44:12 Setting the background color 00:45:25 Embedding a CSS file (link tags) 00:47:00 Colors in CSS 00:48:23 Background images in CSS 00:51:48 Container elements in HTML (div & span) 00:54:50 Adjusting the size (width & height) 00:57:43 The Chrome developer tools 01:00:52 The CSS box model 01:01:40 The margin (space around the element) 01:10:00 Padding (space between frame & content) 01:12:00 Shadow in CSS (box-shadow) 01:14:30 Setting the font in CSS 01:20:10 Setting the line height in CSS 01:21:50 Group selectors (selecting multiple elements) 01:23:00 Setting the font color in CSS 01:23:30 Setting the text alignment in CSS 01:25:25 Shadows for texts in CSS (text-shadow) 01:26:32 Rounded corners in CSS (border-radius) 01:29:10 Images next to texts in CSS (float) 01:32:13 The class attribute (grouping elements) 01:35:35 Borders in CSS (border) 01:39:20 Stretching table cells across multiple columns (colspan) 01:41:20 Tables next to each other (flexbox containers & justify-content) 01:47:15 Gradients in CSS (linear gradient) 01:49:25 Styling the list 01:51:35 Setting the list icon (list-style-type) 01:53:27 Pokeballs as list icons 01:55:20 Size of background images 01:56:00 Repeating background images 01:56:30 Position of background images 01:57:56 Responsiveness & simulation of display sizes 02:00:32 Media queries (conditions for validity of CSS) 02:02:00 Adapting the mobile version of the page 02:11:36 Don't forget to finish & subscribe ;)