⚙

minify CSS

Nén CSS bằng cách loại bỏ chú thích, khoảng trắng và mã dư thừa. Hiển thị chính xác số byte tiết kiệm và tỷ lệ nén. Mọi thứ chạy trong trình duyệt của bạn — không máy chủ, không theo dõi.

Công cụ nhà phát triển Chạy cục bộ Không gửi dữ liệu
Thu gọn CSS nén tối ưu hóa chỉ phía máy khách
Tùy chọn:
Đầu vào CSS
0 byte
→
CSS đã rút gọn
0 byte
💡
CSS Minifier removes comments and unnecessary whitespace to reduce file size without changing functionality. Use the Trình định dạng CSS công cụ nếu bạn cần làm đẹp CSS đã rút gọn để chỉnh sửa. Mức nén thông thường: 20-40% nhỏ hơn.

minify CSS là gì?

Tối giản và nén mã CSS tức thì. Loại bỏ chú thích, khoảng trắng và mã dư thừa để giảm kích thước tệp cho production. Miễn phí, chạy trên trình duyệt, không gửi dữ liệu.

Cách sử dụng minify CSS

  1. Dán CSS của bạn vào bảng nhập.
  2. Chạy minify CSS để loại bỏ khoảng trắng và các ký tự không cần thiết khác.
  3. Xem lại đầu ra thu gọn để đảm bảo stylesheet vẫn hiển thị chính xác.
  4. Sao chép hoặc tải xuống CSS đã minify để triển khai hoặc nhúng.

Công cụ liên quan

📝
Trình định dạng CSS
Làm đẹp hoặc minify mã CSS với định dạng tùy chỉnh
 ⚙
minify JS
Nén JavaScript bằng Terser - mangle và minify
 📄
Công cụ định dạng HTML
Làm đẹp hoặc thu gọn HTML với thụt lề tùy chỉnh
Hiểu về minify CSS ▾
Ví dụ
Đầu vào .btn { color: red; padding: 8px 16px; }
Đầu ra .btn{color:red;padding:8px 16px}
Các trường hợp sử dụng phổ biến
  • Giảm kích thước stylesheet trước khi triển khai
  • CSS thu gọn cho nhúng hoặc đoạn mã
  • So sánh đầu ra đã định dạng và đã minify khi gỡ lỗi
  • Chuẩn bị payload kiểu dáng nhỏ hơn cho trang tĩnh hoặc email
Câu hỏi thường gặp
Việc minify CSS có làm hỏng kiểu dáng của tôi không?

No. The minifier only removes characters that have no effect on CSS parsing -whitespace and comments. The minified output is functionally identical to the original.

Tôi có nên giữ nguyên CSS gốc đã định dạng không?

Có. Luôn giữ tệp nguồn dễ đọc trong kho lưu trữ của bạn và chỉ triển khai phiên bản đã rút gọn. Dùng source map nếu bạn cần gỡ lỗi CSS đã rút gọn trong DevTools của trình duyệt.

Có thể giảm bao nhiêu kích thước tệp?

Mức tiết kiệm thông thường từ 20% đến 50%, tùy vào lượng khoảng trắng và chú thích trong tệp gốc. Có thể tiết kiệm thêm nhờ nén gzip ở cấp máy chủ.

Công cụ rút gọn có hỗ trợ thuộc tính tùy chỉnh CSS (biến) không?

Có. Thuộc tính tùy chỉnh CSS (--my-var: value) được giữ nguyên như khi viết trong quá trình rút gọn.