Advanced CSS

د دې کورس په اړه

1. 01 Why CSS Is Important 4 min

    In this lecture, you will learn why CSS (Cascading Style Sheets) is essential for modern web development. We will explore how CSS controls layout, colors, fonts, spacing, and responsiveness, and how it separates design from structure. By the end of this lesson, you will understand how CSS improves website appearance, user experience, and maintainability. 

2. 02 Getting Started with CSS 17 min

    In this lecture, you will learn how to use CSS to style web pages. We will cover different ways to apply CSS, including inline, internal, and external stylesheets. You will also learn basic CSS syntax, selectors, and how to link CSS files to HTML. By the end of this lesson, you will be able to apply CSS styles to create clean and visually appealing web pages. 

3. 03 Introduction to CSS 2 min

    In this lecture, you will be introduced to CSS (Cascading Style Sheets) and its role in web development. We will discuss what CSS is, why it is used, and how it works with HTML to style web pages. By the end of this lesson, you will understand the basics of CSS and be ready to start styling websites. 

4. 04 CSS Syntax Basics 1 min

    In this lecture, you will learn the basic syntax of CSS and how styles are written. We will cover selectors, properties, and values, and understand how CSS rules are structured. By the end of this lesson, you will be able to write clean and correct CSS code to style HTML elements. 

5. 05 CSS Selectors: The Basics 6 min

   In this lecture, you will learn about basic CSS selectors and how they are used to target HTML elements. We will cover element selectors, class selectors, ID selectors, and the universal selector. By the end of this lesson, you will be able to select and style elements efficiently using CSS.

   
   

6. 06 CSS ID and Class Selector Explained 10 min

    In this lecture, you will learn how the CSS ID selector works and when to use it. We will cover the syntax of the ID selector, how to target unique elements using the #id selector, and best practices to avoid common mistakes. By the end of this lesson, you will understand how ID selectors differ from class selectors and how to use them correctly in your CSS code. 

7. 07 Working with CSS Colors 16 min

    In this lecture, you will learn how to work with colors in CSS. We will cover different color formats such as color names, HEX, RGB, RGBA, HSL, and HSLA. You will also learn how to apply colors to text, backgrounds, borders, and other elements to create visually appealing web designs. 

8. 08 Working with Gradients in CSS 18 min

   In this lecture, you will learn the basics of CSS gradients and how to use them to create smooth color transitions. We will cover linear gradients and radial gradients, gradient direction, color stops, and common use cases. By the end of this lesson, you will be able to enhance your website designs using CSS gradients.

   
   

9. 09 Working with Box Shadow & Text Shadow 12 min

   In this lecture, you will learn how CSS shadows work and how to apply them to elements and text. We will cover box-shadow and text-shadow, including shadow offset, blur, spread, and color. By the end of this lesson, you will be able to add depth and visual emphasis to your web designs using CSS shadows.

   
   

10. 10 Understanding CSS Borders 13 min

    In this lecture, you will learn how to work with borders in CSS. We will cover border width, style, and color, as well as shorthand properties and individual side borders. You will also learn how to create rounded corners using border-radius and understand best practices for styling element borders. By the end of this lesson, you will be able to design clean and well-defined layouts using CSS borders.

    
    

11. 11 CSS Table Styling 17 min

    In this lecture, you will learn how to style HTML tables using CSS. We will cover table borders, spacing, background colors, text alignment, hover effects, and responsive table design. By the end of this lesson, you will be able to create clean, readable, and visually appealing tables using CSS.

    
    

12. 12 Inheritance in CSS 6 min

    In this lecture, you will learn how inheritance works in CSS and how styles are passed from parent elements to their children. We will explore which CSS properties are inherited by default, how to control inheritance using values like inherit, initial, and unset, and common use cases. By the end of this lesson, you will understand how inheritance affects styling and how to manage it effectively.

    
    

13. 13 Designing Cards Using CSS 8 min

    In this lecture, you will learn how to design and style card components using CSS. We will cover layout techniques, spacing, borders, shadows, hover effects, and responsive design principles. By the end of this lesson, you will be able to create modern, reusable card layouts commonly used in blogs, portfolios, and dashboards.

    
    

14. 14 Understanding CSS Specificity 15 min

    In this lecture, you will learn how CSS selector specificity works and how browsers decide which styles to apply when multiple rules target the same element. We will cover the specificity hierarchy, including inline styles, ID selectors, class selectors, and element selectors, along with practical examples. By the end of this lesson, you will be able to write predictable and conflict-free CSS.

    
    

15. 15 Layouts in CSS 2 min

     In this lecture, you will learn how to create web page layouts using CSS. We will explore layout methods such as block and inline elements, positioning, Flexbox, and Grid. By the end of this lesson, you will understand how to structure responsive and well-organized page layouts using modern CSS techniques. 

16. 16 CSS Box Model Explained 17 min

    In this lecture, you will learn how the CSS box model works and how it affects the size and spacing of elements. We will cover content, padding, border, and margin, along with box sizing and common layout issues. By the end of this lesson, you will be able to control spacing and layout more accurately using the CSS box model.

    
    

17. 17 Sizing Elements in CSS 7 min

    Learn how to control element size using CSS width, height, and sizing units.