CSS - The Guide from Beginner to Advanced

1 Text Editor Setup 02:35 2 Defining CSS 03:05 3 Inline CSS 04:30 4 Internal or Embedded CSS 02:57 5 Externally Linked CSS 03:50 6 Power Struggle 02:28 7 Basic CSS Syntax 10:16 8 Element Selectors 03:11 9 Group Selectors 01:38 10 ID Selector 03:32 11 Class Selector 04:15 12 ID and Class Selector Combined 03:41 13 DIV and SPAN element 05:15 14 Inheritance and Exceptions in CSS 02:13 15 Last Rule Principle, Specificity & Universal Selector 05:47

1 Color and Background Color Properties 02:16 2 Color by name. 01:35 3 Color by RGB 03:12 4 Color by RGBA 03:30 5 Color By HEX 03:39 6 VS Code Color Picker 01:45 7 Color Resources 02:58

1 Pixels 04:10 2 Percentage Values 03:31 3 EM Values 05:14 4 REM Values 02:31 5 VH and VW 03:03 6 Default Browser Styles and the dev tools 05:58 7 The calc() function 04:48

1 Font Family 03:10 2 Font stack 03:44 3 Google Fonts - Online 05:44 4 Google Fonts - Offline 03:43 5 Font weight and font style 01:39 6 Text align and Text Indent 01:31 7 Line-height, later-spacing, word-spacing, text-transform, and text-decoration 05:53

1 Introduction 04:12 2 CSS Box Model - Padding 05:49 3 CSS Box Model – Margin 03:26 4 CSS Box Model – Border 04:56 5 Border Radius and Negative Margin 04:44 6 Center using margin 02:04 7 Outline 04:11

1 Display Property 07:41 2 Example for Display Block 05:30 3 Box Sizing 05:07 4 Display inline Block 01:50 5 Display none, Opacity, and Visibility 04:51

1 Downloading Royalty Free Images 02:53 2 Setting background of a div for big and small image 04:07 3 Background repeat property 02:14 4 Background sizing 03:04 5 Background position 03:18 6 Background attachment 04:14 7 Linear gradient 06:11 8 Linear gradient and background image combined 07:19 9 Gradients from colorzilla 02:32

1 Float property 09:07 2 Float property with 3 column layout 04:30 3 Position static 01:45 4 Position Relative 01:44 5 Position absolute 05:02 6 Position fixed 03:21 7 Media queries 08:05 8 Z Index 06:13 9 Before and after pseudo elements 13:23

1 Basic Selectors 01:59 2 Descendant and direct child selector 03:55 3 First-line and first-later pseudo selectors 01:37 4 Hover pseudo selector 02:37 5 Link pseudo class selectors 02:53 6 Root pseudo selector 03:17

1 Transform translate 04:51 2 Transform scale 01:41 3 Transform rotate 03:04 4 Transform skew 02:16 5 Transition 03:14 6 Multiple transitions 02:24 7 Transition Delay 02:47 8 Transition timing function 07:02 9 Animation 08:50 10 Animation fill mode 04:03

1 CSS Variables 09:08 2 Font awesome icons 06:40 3 Text shadow 05:35 4 Browser prefixes 06:18 5 Semantic HTML 03:00 6 Emmet workflow 05:17

1 Display Flex and Inline-flex 05:13 2 Flex direction 02:10 3 Flex-wrap 02:54 4 Justify-content 03:43 5 Align Items 04:50 6 Center elements with Flexbox 04:52 7 Align content 06:23 8 Main axis 04:20 9 Order of elements 03:16 10 Align self 01:43 11 Flex grow 02:52 12 Flex-shrink 02:32 13 Flex-basis 04:13

1 Final project introduction 03:54 2 Environment Setup 05:50 3 Header Section 18:17 4 Header Section animation 05:16 5 Divider 03:20 6 Huduma Section 13:52 7 Kuhusu Section 09:21 8 Bidhaa Section 11:50 9 Mawasiliano Section 11:48 10 Footer Section 06:56 11 Navigation 09:23 12 Navigation animation 08:55 13 Adding responsiveness 19:19 14 Sending Email 04:12 15 Hosting our site with Netlify 04:40 16 Final Message 01:36