bookmark_borderbookmark
Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang
Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.
Trong ví dụ thứ 7 này, hãy kết hợp một số khái niệm bạn đã tìm hiểu để tạo bố cục thích ứng với các thành phần con linh hoạt được đặt tự động. Khá rõ ràng. Các thuật ngữ chính cần nhớ ở đây là repeat, auto-(fit|fill) và minmax(). Bạn sẽ nhớ các thuật ngữ này theo từ viết tắt RAM.
Bạn đang sử dụng lại repeat(), nhưng lần này sử dụng từ khoá auto-fit thay vì giá trị số rõ ràng. Thao tác này sẽ bật tính năng tự động định vị các phần tử con này. Các phần tử con này có giá trị tối thiểu cơ bản là 150px với giá trị tối đa là 1fr, nghĩa là trên các màn hình nhỏ hơn, chúng sẽ chiếm toàn bộ chiều rộng 1fr và khi đạt chiều rộng 150px, các phần tử con này sẽ bắt đầu tràn vào cùng một dòng.
Với auto-fit, mọi bản nhạc trống hoàn toàn sẽ thu gọn về 0 và các bản nhạc đã lấp đầy sẽ tăng lên và chiếm dung lượng của chúng. Tuy nhiên, nếu bạn thay đổi thuộc tính này thành auto-fill, các bản nhạc trống sẽ chiếm cùng một dung lượng khi được lấp đầy:
[[["Dễ hiểu","easyToUnderstand","thumb-up"],["Giúp tôi giải quyết được vấn đề","solvedMyProblem","thumb-up"],["Khác","otherUp","thumb-up"]],[["Thiếu thông tin tôi cần","missingTheInformationINeed","thumb-down"],["Quá phức tạp/quá nhiều bước","tooComplicatedTooManySteps","thumb-down"],["Đã lỗi thời","outOfDate","thumb-down"],["Vấn đề về bản dịch","translationIssue","thumb-down"],["Vấn đề về mẫu/mã","samplesCodeIssue","thumb-down"],["Khác","otherDown","thumb-down"]],["Cập nhật lần gần đây nhất: 2023-10-25 UTC."],[],[]]