Định dạng và rút gọn CSS
Giúp CSS dễ đọc trở lại, hoặc nén nhỏ để trang web chạy nhanh hơn.
Dán CSS, mở file .css hoặc kéo thả vào đây
Tiếp theo: Định dạng HTML · Định dạng và rút gọn JavaScript
Cách sử dụng Định dạng và rút gọn CSS
Dán CSS của bạn
Dán một stylesheet, hoặc mở hay kéo thả một file .css. Mã được định dạng ngay khi bạn gõ.
Làm đẹp hoặc rút gọn
Làm đẹp đặt mỗi quy tắc và thuộc tính trên một dòng riêng. Rút gọn xóa chú thích, dấu cách và mọi thứ trình duyệt không cần.
Sao chép hoặc tải xuống
Sao chép kết quả, hoặc tải xuống dưới dạng file .css. Khi rút gọn, bạn sẽ thấy kích thước trước và sau.
Tại sao nên dùng Utils365
Hơn cả việc xóa dấu cách
Trình rút gọn còn rút ngắn màu như #ff0000 thành red, bỏ đơn vị sau số 0 và xóa các quy tắc rỗng.
Quy tắc giữ nguyên thứ tự
Quy tắc không bao giờ bị gộp hay di chuyển, nên cascade hoạt động đúng như trước và không có gì bị ghi đè ngoài ý muốn.
Giữ chú thích giấy phép
Chú thích bắt đầu bằng /*! được giữ trong file rút gọn, như nhiều giấy phép mã nguồn mở yêu cầu.
Riêng tư ngay từ thiết kế
CSS được định dạng ngay trên trình duyệt và không bao giờ bị tải lên.
Các câu hỏi thường gặp
CSS rút gọn nhỏ đi bao nhiêu?
Thường là 15–30%, nhiều hơn nếu stylesheet có nhiều chú thích. Phần tóm tắt hiện chính xác kích thước trước và sau, cùng phần trăm tiết kiệm được.
Rút gọn có làm hỏng style không?
Công cụ được thiết kế để không làm vậy. Giá trị chỉ được viết lại theo cách mang cùng ý nghĩa, và quy tắc giữ nguyên thứ tự, nên quy tắc nào được áp dụng vẫn không đổi.
Làm sao để giải nén CSS đã rút gọn?
Dán CSS đã rút gọn và chọn Làm đẹp. Mỗi quy tắc và thuộc tính sẽ nằm trên một dòng riêng với kiểu thụt lề bạn chọn. Chú thích đã bị xóa thì không thể khôi phục.
Có dùng được với SCSS hoặc Less không?
Làm đẹp xử lý được hầu hết SCSS và Less, kể cả lồng nhau. Rút gọn cần CSS thuần, nên hãy biên dịch SCSS hoặc Less trước.