Learn CSS: Layout & Design

Học CSS từng bước một, từ bộ chọn đầu tiên đến bố cục đáp ứng, hoạt ảnh và thiết kế web hiện đại. Gõ một dòng CSS và xem trang thay đổi trên điện thoại của bạn: trình soạn thảo hiển thị HTML và CSS cạnh nhau với bản xem trước trực tiếp.

Khóa học CSS này được xây dựng dành cho người mới bắt đầu và sẽ phát triển cùng bạn. Mỗi khóa học là một chủ đề thực tế, mỗi bài học ngắn gọn và trình soạn thảo luôn sẵn sàng chỉ với một lần chạm, vì vậy bạn thực hành những gì mình vừa đọc thay vì chỉ đọc về nó.

NỘI DUNG BÊN TRONG

• 40 khóa học và 159 bài học ngắn gọn, từ trình độ sơ cấp (A1) đến nâng cao (C1)

• Trình chỉnh sửa HTML và CSS trực tiếp với bản xem trước tức thì, để thử nghiệm nhanh và tạo trang riêng của bạn

• 20 dự án thiết kế web có hướng dẫn, từng bước một: thanh công cụ, lưới thẻ, tiêu đề cố định, nút nhấp nháy và hơn thế nữa

• 20 nhiệm vụ tìm lỗi: thẻ rộng hơn cột 42px, truy vấn phương tiện không bao giờ hoạt động trên điện thoại, cửa sổ modal bị kẹt phía sau trang

• Bài kiểm tra cuối khóa và chứng chỉ hoàn thành

• Ứng dụng có sẵn 22 ngôn ngữ

MỘT LỘ TRÌNH HOÀN CHỈNH, TỪ SƠ CẤP ĐẾN NÂNG CAO

• Cú pháp và bộ chọn, màu sắc, hình nền và kiểu chữ

• Mô hình hộp, hiển thị, định vị, đơn vị và giá trị

• Lớp giả và phần tử giả

• Kiến thức cơ bản về Flexbox và Flexbox nâng cao

• Kiến thức cơ bản về lưới, vùng lưới và Bố cục lưới nâng cao

• Thiết kế đáp ứng, truy vấn phương tiện và truy vấn vùng chứa

• Thuộc tính tùy chỉnh (biến), hàm, độ ưu tiên, cascade và @layer

• Chuyển tiếp, biến đổi, hoạt ảnh khung hình chính, bộ lọc và chế độ hòa trộn

• Chế độ tối và bảng màu, cuộn và tràn, clip-path và hình dạng

• Gỡ lỗi với DevTools, kiến ​​trúc BEM, Sass, PostCSS và mã thông báo thiết kế

• Mẫu thành phần, mẫu bố cục hiện đại, hiệu suất và Houdini

THỰC HÀNH HIỆU QUẢ

• Bài kiểm tra để kiểm tra những gì bạn đã học

• Bảng tóm tắt với 69 mục về thuộc tính, bộ chọn và cú pháp bố cục

• 50 câu hỏi phỏng vấn với câu trả lời rõ ràng, hữu ích trước khi phỏng vấn vị trí lập trình viên front-end hoặc web

• Thư viện mã nguồn gồm các ví dụ ngắn bạn có thể mở và chỉnh sửa

• Lưu mã, ghi chú và bài học yêu thích của riêng bạn

• Thử thách lập trình toàn cầu: ba vòng toàn cầu mỗi ngày, được giải quyết bằng Python, JavaScript và các ngôn ngữ khác

• Chuỗi thành tích, XP, a Bảng xếp hạng và lời nhắc hàng ngày để giúp bạn duy trì việc luyện tập

TRỢ LÝ AI

• Gặp khó khăn với bố cục hoặc thuộc tính? Hãy hỏi trợ lý AI về khái niệm, lỗi hoặc mã của chính bạn

• Sân chơi AI: mô tả một trang và xem HTML và CSS được xây dựng

• Người dùng miễn phí được cấp một lượng AI nhất định mỗi ngày; Phiên bản Pro cho phép sử dụng không giới hạn

DÀNH CHO AI

• Người mới bắt đầu hoàn toàn, đang bước những bước đầu tiên trong lĩnh vực phát triển web

• Các nhà thiết kế muốn tự thiết kế giao diện trang web của mình thay vì chỉ sử dụng bản mẫu

• Sinh viên muốn thực hành thêm bên cạnh khóa học thiết kế web

• Các nhà phát triển đã biết một chút về HTML và CSS và muốn hiểu rõ hơn về flexbox và grid

• Người chuyển đổi nghề nghiệp đang chuẩn bị cho công việc front-end

CÁCH THỨC HOẠT ĐỘNG

1. Bắt đầu với khóa học miễn phí đầu tiên: Cú pháp và bộ chọn CSS

2. Mở trình chỉnh sửa, thay đổi một giá trị và xem bản xem trước

3. Tiếp tục học các khóa học sau: mô hình hộp, flexbox, grid, thiết kế đáp ứng và hoạt ảnh

4. Xây dựng các dự án có hướng dẫn và sửa các lỗi bố cục thực tế trong các bài tập

5. Vượt qua kỳ thi cuối cùng và nhận chứng chỉ

PHIÊN BẢN MIỄN PHÍ VÀ PRO

Khóa học đầu tiên, dự án có hướng dẫn đầu tiên, hai bài tập và trình chỉnh sửa trực tiếp đều miễn phí, kèm theo một người hướng dẫn AI hàng ngày. Phiên bản Pro mở khóa tất cả các khóa học, tất cả các dự án và bài tập, kỳ thi chứng chỉ và AI không giới hạn, đồng thời loại bỏ quảng cáo.

Hãy bắt đầu ngay hôm nay, học CSS theo tốc độ của riêng bạn và tạo kiểu cho trang đầu tiên chỉ trong vài phút.