Course curriculum

  • 1

    CSS 101

    • 000_Course_introduction

      FREE PREVIEW
    • 010_What_is_CSS

    • 020_How_does_CSS_work

    • 030_CSS_syntax_overview

    • 040_Inline_CSS

    • 050_Internal_CSS

    • 060_CSS_selectors_introduction

    • 070_Element_selectors

    • 080_Class_selectors

    • 090_ID_selectors

    • 100_Grouped_selectors

    • 110_Nested_selements

    • 120_Commenting_your_code

    • 130_Text_colors

    • 140_Different_color_types

    • 150_Link_states

    • 160_Font_sizes

    • 170_Measurement_types

    • 180_Background_colors

    • 190_Background_images

    • 200_The_inspect_tool

    • 210_Text_align

    • 220_Borders

    • 230_Border_radius

    • 240_Display

    • 250_Width

    • 260_Height

    • 270_Box_shadows

    • 280_Padding

    • 290_Margin

    • 300_Max_width

    • 310_Opacity

    • 320_External_CSS

    • 330_Floating_elements

    • 340_What_we_havent_learned_yet

    • 350_Your_project

    • 360_Summary

  • 2

    CSS 201

    • 000_Course_Introduction

    • 010_The_display_property

    • 020_The_box_model

    • 030_Outlines

    • 040_Text_shadows

    • 050_Minimum_element_width

    • 060_Introduction_to_CSS_positions

    • 070_Relative_positioning

    • 080_Absolute_positioning

    • 090_Fixed_positioning

    • 100_Sticky_positioning

    • 110_Overflowing_text

    • 120_Centering_block_elements

    • 130_Advanced_CSS_selectors

    • 140_Introduction_to_psuedo_selectors

    • 150_Pseudo_selectors

    • 160_Introduction_to_pseudo_elements

    • 170_Before_and_after_pseudo_elements

    • 180_First_letter_and_first_line_pseudo_elements

    • 190_Highlighting_text_with_selection

    • 200_Smooth_transitions

    • 210_Gradient_backgrounds

    • 220_Layering_backgrounds_and_gradients

    • 230_Custom_web_fonts

    • 240_Transformations

    • 250_Animations

    • 260_Flexbox

    • 270_Grid

    • 290_Your_project

    • 300_Summary

  • 3

    CSS 301

    • 000_Course_introduction

    • 010_The_viewport_meta_element

    • 020_Media_query_syntax

    • 030_What_is_mobile-first

    • 040_Responsive_images

    • 050_Responsive_embeds

    • 060_Multiple_media_queries

    • 070_Making_a_responsive_layout

    • 080_Your_project

    • 100_Summary