RevealTheme logo

Trình nén CSS

Loại bỏ các chú thích, khoảng trắng và ký tự không cần thiết khỏi CSS để giảm kích thước tệp.

Cách sử dụng công cụ này

  1. 1

    Paste your CSS — a single rule, a component stylesheet, or an entire file.

  2. 2

    The minified result and the byte savings appear instantly below the input.

  3. 3

    Copy the minified output, or compare the before/after byte count to see the reduction.

Trình nén CSS là gì?

CSS đã được nén tải nhanh hơn: từng byte đều quan trọng trên đường dẫn render quan trọng. Việc nén loại bỏ các chú thích, gộp khoảng trắng và đơn giản hóa cú pháp (ví dụ, 'color: #ffffff' trở thành 'color:#fff'). Đối với các trang web production, hãy dùng một trình nén tại thời điểm biên dịch như cssnano; công cụ này dành cho các đoạn CSS lẻ tẻ.

Các trường hợp sử dụng phổ biến

  • Shrink a critical-CSS snippet you're inlining into the <head> to remove a render-blocking request.

  • Compress CSS for an HTML email or newsletter, where every kilobyte counts and there's no build pipeline.

  • Paste CSS into a CMS or page-builder field that doesn't minify automatically (WordPress 'Additional CSS', Shopify theme settings).

  • Check how much weight a third-party stylesheet adds before deciding whether to self-host it.

  • Clean up CSS copied from DevTools, which arrives with computed-style comments and inconsistent spacing.

  • Produce a one-line version of a rule to paste into a chat, ticket, or code-review comment.

Câu hỏi thường gặp

Việc nén có làm hỏng CSS của tôi không?
Không: việc nén giữ nguyên ngữ nghĩa. Nếu CSS của bạn bị hỏng, thì nguồn vốn đã có lỗi cú pháp mà trình duyệt dung thứ nhưng trình nén thì không.
Tôi có thể mong đợi giảm kích thước được bao nhiêu?
Khoảng 20 % đến 40 % đối với CSS viết tay thông thường. Ít hơn đối với CSS đã được nén sẵn từ các framework.

Công cụ liên quan