Udemy

CSS Complete Guide (incl. Animation, Flexbox, Grid & Sass)

立即報名
  • 143 名學生
  • 更新於 11/2025
4.7
(20 個評分)
CTgoodjobs 嚴選優質課程,為職場人士提升競爭力。透過本站連結購買Udemy課程,本站將獲得推廣佣金,有助未來提供更多實用進修課程資訊給讀者。

課程資料

報名日期
全年招生
課程級別
學習模式
教學語言
英語
授課導師
Jayanta Sarkar
評分
4.7
(20 個評分)
2次瀏覽

課程簡介

CSS Complete Guide (incl. Animation, Flexbox, Grid & Sass)

CSS for the first time or brushing up on your skills to dive even deeper, this course is a must for EVERY web developer.

In this comprehensive CSS course, you will delve into the world of Cascading Style Sheets (CSS) and master not only the fundamentals but also advanced techniques including animation, layout with Flexbox and Grid, and the use of Sass for efficient styling. Whether you're a beginner looking to start from scratch or an experienced developer aiming to refine your CSS skills, this course has something valuable to offer.

Course Outline:

  1. CSS Fundamentals: Explore CSS basic properties such as padding, margin, height, width, cursor, clip-path, shape outside, box shadow, overflow, and more.

  2. CSS Text and Font Properties: Dive into font-family, font-size, font-weight, font-style, text-align, text-decoration, text-transform, line-height, and other text-related properties.

  3. CSS Background Properties: Learn about background-color, background-image, background-repeat, background-position, background-size, background-attachment, and related concepts.

  4. CSS Layout Techniques: Understand display options, visibility, positioning, z-index, media queries for responsiveness, table styling, object-fit, resize, and advanced layout techniques.

  5. Advanced CSS Units, Functions, and Variables: Discover CSS units like em, rem, vh, vw, vmax, vmin, CSS variables, functions, and their practical applications.

  6. CSS Advanced Selectors: Master combinator selectors, attribute selectors, pseudo-classes, CSS pseudo-elements, and their uses in creating dynamic styles.

  7. CSS Animation: Explore CSS filter effects, transitions, 2D and 3D transforms, perspective, transform-style, animations, and work on hands-on projects to apply these concepts.

  8. CSS Grid: Gain a thorough understanding of CSS Grid properties and create responsive grid-based layouts effortlessly.

  9. CSS Flexbox: Harness the power of CSS Flexbox to design complex and responsive layouts with ease, making your designs adaptable to various screen sizes and devices.

  10. Modern CSS Preprocessor - Sass: Integrate Sass (Syntactically Awesome Style Sheets) into your workflow to enhance CSS with features like variables, nesting, mixins, and functions, streamlining your styling process and making your code more maintainable and scalable.

By the end of this course, you will have a strong command of CSS, enabling you to create stunning and responsive web designs while leveraging the latest techniques and tools in the field.

課程章節

  • 10 個章節
  • 250 堂課
  • 第 1 章 Introduction
  • 第 2 章 Basic CSS fundamentals
  • 第 3 章 CSS text and font properties
  • 第 4 章 CSS background properties
  • 第 5 章 CSS Layout
  • 第 6 章 Advanced CSS units, function and variable
  • 第 7 章 CSS advanced selector
  • 第 8 章 Advanced CSS fundamentals
  • 第 9 章 CSS Animation
  • 第 10 章 CSS Grid

課程內容

  • CSS fundamentals : learn CSS basic properties like padding, margin, height ,Width, Corsor , Clip-Path, Shape Outside, Box shadow, Overflow etc
  • CSS text and font properties : font-family, font-size, font-weight, font-style, text-align, text-decoration, text-transform, line-height and many more
  • CSS background properties : background-color, background-image, background-repeat, background-position, background-size, background-attachment Etc.
  • CSS Layout : Display, Visibility, Position, Z-Index, Media Queries, Table, Object-fit, Resize and more.
  • Advanced CSS units, function and variable : CSS Units (em,rem,vh, vw,vmax,vmin and more), Css Variables, CSS function() and more
  • CSS advanced selector : Combinator selector, attribute selector, Pseudo-classes Selector, CSS Pseudo Element and more
  • CSS Animation : CSS Filter , CSS Transition, Transform 2D, Transform 3D , CSS Perspective, CSS Transform-Style, CSS Animation and Projects.
  • CSS Grid : learn complete CSS Grid properties from the very beginning
  • CSS FlexBox : CSS Flexbox is a powerful layout model that allows you to design complex and responsive layouts with ease.
  • learn new modern CSS preprocessor : Sass (Syntactically Awesome Style Sheets) is a CSS preprocessor that extends the functionality of CSS by adding features .

評價

  • N
    Neha Sarkar
    5.0

    This is phenomenal completely meet my expectation.

  • L
    Laurent Mwema
    4.0

    the best css course, i'm learning new properties

  • J
    Jayanta Sarkar
    5.0

    This course is fantastic well organised and full with detail.

  • T
    Tam Swe
    5.0

    Very good explanation and very in depth.

立即關注瀏覽更多

本網站使用Cookies來改善您的瀏覽體驗,請確定您同意及接受我們的私隱政策使用條款才繼續瀏覽。

我已閱讀及同意