CSS Cơ Bản đến Nâng Cao - Làm Chủ Giao Diện Web Chuyên Nghiệp

Tìm hiểu về CSS, cách liên kết với HTML và những khái niệm cơ bản

• Giới thiệu về CSS và vai trò trong web development

  Tìm hiểu về CSS, lịch sử phát triển và tầm quan trọng trong thiết kế web • 5 phút
• Cách liên kết CSS với HTML (Inline, Internal, External)

  Học các cách khác nhau để áp dụng CSS vào HTML và best practices • 9 phút
• CSS Selectors - Class, ID, Element

  Hiểu về các loại selector cơ bản để chọn và styling HTML elements • 6 phút
• CSS Properties cơ bản - Color, Font, Text

  Học cách thay đổi màu sắc, font chữ và định dạng text • 12 phút
• CSS Units - px, em, rem, %, vh, vw

  Học về css units - px, em, rem, %, vh, vw • 15 phút
• CSS Comments và Best Practices

  Học về css comments và best practices • 11 phút
• DevTools - Inspect và Debug CSS

  Học về devtools - inspect và debug css • 15 phút
• Bài tập thực hành: Styling văn bản cơ bản

  Học về bài tập thực hành: styling văn bản cơ bản • 8 phút

Hiểu về Box Model, Margin, Padding, Border và các kỹ thuật layout

• CSS Box Model - Margin, Border, Padding, Content

  Học về css box model - margin, border, padding, content • 5 phút
• Width, Height và Box-sizing

  Học về width, height và box-sizing • 15 phút
• Display Property - Block, Inline, Inline-block

  Học về display property - block, inline, inline-block • 5 phút
• CSS Position - Static, Relative, Absolute, Fixed

  Học về css position - static, relative, absolute, fixed • 7 phút
• Float và Clear (Legacy Layout)

  Học về float và clear (legacy layout) • 14 phút
• Z-index và Stacking Context

  Học về z-index và stacking context • 12 phút
• Overflow và Visibility

  Học về overflow và visibility • 15 phút
• Background Properties - Color, Image, Position

  Học về background properties - color, image, position • 7 phút
• Bài tập thực hành: Tạo layout cơ bản với Position

  Học về bài tập thực hành: tạo layout cơ bản với position • 7 phút

Làm chủ CSS Flexbox và Grid - công cụ layout hiện đại

• Giới thiệu về Flexbox và khi nào sử dụng

  Học về giới thiệu về flexbox và khi nào sử dụng • 11 phút
• Flex Container Properties - display, direction, wrap

  Học về flex container properties - display, direction, wrap • 5 phút
• Flex Item Properties - grow, shrink, basis

  Học về flex item properties - grow, shrink, basis • 14 phút
• Justify-content và Align-items

  Học về justify-content và align-items • 8 phút
• CSS Grid - Giới thiệu và Grid Container

  Học về css grid - giới thiệu và grid container • 13 phút
• Grid Template - Rows, Columns, Areas

  Học về grid template - rows, columns, areas • 5 phút
• Grid Item Placement và Grid Lines

  Học về grid item placement và grid lines • 13 phút
• Responsive Layout với Flexbox và Grid

  Học về responsive layout với flexbox và grid • 8 phút
• Bài tập thực hành: Website layout với Grid và Flexbox

  Học về bài tập thực hành: website layout với grid và flexbox • 5 phút

Thiết kế responsive, mobile-first và tối ưu cho mọi thiết bị

• Mobile-first Design và Viewport Meta Tag

  Học về mobile-first design và viewport meta tag • 8 phút
• Media Queries - Breakpoints và Syntax

  Học về media queries - breakpoints và syntax • 14 phút
• Responsive Images và Picture Element

  Học về responsive images và picture element • 13 phút
• Responsive Typography với clamp() và vw units

  Học về responsive typography với clamp() và vw units • 14 phút
• Container Queries (CSS mới nhất)

  Học về container queries (css mới nhất) • 12 phút
• Testing Responsive Design

  Học về testing responsive design • 14 phút
• Performance và Optimization

  Học về performance và optimization • 13 phút
• Bài tập thực hành: Responsive Landing Page

  Học về bài tập thực hành: responsive landing page • 12 phút

CSS Animations, Variables, Preprocessors và kỹ thuật nâng cao

• CSS Transitions - Property, Duration, Timing-function

  Học về css transitions - property, duration, timing-function • 15 phút
• CSS Animations và Keyframes

  Học về css animations và keyframes • 11 phút
• Transform 2D và 3D

  Học về transform 2d và 3d • 5 phút
• CSS Variables (Custom Properties)

  Học về css variables (custom properties) • 6 phút
• CSS Functions - calc(), min(), max(), clamp()

  Học về css functions - calc(), min(), max(), clamp() • 8 phút
• Pseudo-classes và Pseudo-elements nâng cao

  Học về pseudo-classes và pseudo-elements nâng cao • 9 phút
• CSS Grid và Flexbox nâng cao

  Học về css grid và flexbox nâng cao • 15 phút
• CSS Architecture - BEM, OOCSS, SMACSS

  Học về css architecture - bem, oocss, smacss • 13 phút
• Sass/SCSS Introduction

  Học về sass/scss introduction • 14 phút
• Project cuối khóa: Portfolio Website hoàn chỉnh

  Học về project cuối khóa: portfolio website hoàn chỉnh • 12 phút