Lớp học lập trình: Căn giữa trong CSS

Adam Argyle

Lớp học lập trình này giúp bạn chia sẻ và giới thiệu cách căn giữa mà bạn yêu thích trong CSS.

Hãy xem bài đăng trên blog của tôi Centering in CSS (Căn giữa trong CSS) để tìm hiểu về 5 cách căn giữa mà tôi yêu thích trong CSS. Hoặc xem video này!

Thiết lập

  1. Nhấp vào Trộn để chỉnh sửa để có thể chỉnh sửa dự án.
  2. Mở app/index.html
  3. Tại line 23, hãy thay thế /* your centering CSS here /* bằng CSS của bạn
  4. (không bắt buộc) Đặt tên cho kỹ thuật căn giữa và thay thế văn bản trong <h1>

Kiểu

  1. Tạo một tệp mới trong thư mục app/css/
  2. Tạo một bộ chọn để giữ giải pháp căn giữa của bạn, chẳng hạn như .turbo-center hoặc [floaty-mcfloat]
  3. Trong bộ chọn mới đó, hãy viết kỹ thuật căn giữa của bạn (bạn có thể xem các kỹ thuật khác trong app/css/ làm ví dụ)
  4. (không bắt buộc) viết một số "kiểu hỗ trợ" để chúng ta có thể xem những trẻ em nào cần kiểu hỗ trợ để căn giữa
  5. Mở app/css/index.css rồi nhập tệp mới ở dưới cùng

Kết hợp tất cả

  1. Mở lại app/index.html
  2. Tìm <article> và đặt cho nó bộ chọn tuỳ chỉnh mà bạn đã tạo ở bước 2 của phần trước.
  3. Gửi cho tôi một tweet về Glitch của bạn và tôi sẽ đăng nó trong bài đăng trên blog!