Monu Tools

Định dạng CSS

Làm đẹp CSS với thụt lề gọn gàng, hoặc thu gọn để giảm kích thước tệp. Xử lý media query, calc() và chú thích giấy phép.

Cách dùng Định dạng CSS

  1. 01

    Dán CSS của bạn vào ô đầu vào.

  2. 02

    Chọn Làm đẹp để định dạng hoặc Thu gọn để nén.

  3. 03

    Chọn kích thước thụt lề, rồi sao chép kết quả.

What the CSS formatter does

This is a CSS formatter that beautifies stylesheets with clean, consistent indentation, or minifies them to shrink file size. You choose the indent size for beautifying, and switch to minify when you want the smallest output.

When to beautify and when to minify

Readable CSS is easier to scan, review and debug: when each rule and declaration is indented consistently, you can see selectors, nesting and the shape of your media queries at a glance.

Minifying is for production. It removes the whitespace and comments that browsers do not need, so the file downloads faster. On a large stylesheet the saving adds up, especially before gzip compression on the server.

Careful minifying with calc() and media queries

The minifier is careful where it matters. It keeps the spaces around plus and minus inside calc(), so calc(100% - 30px) stays valid, and it only strips spaces around structural characters such as braces, colons and semicolons. It also handles nested media queries correctly.

License comments are preserved

License comments written in the /*! ... */ form are preserved, which is the standard convention for keeping copyright and license notices in minified output even when ordinary comments are removed.

Runs in your browser

Both beautify and minify run entirely in your browser, so your stylesheets never leave your device. The tool formats for readability and size; it does not validate that your CSS is correct.

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

Thu gọn có làm hỏng biểu thức calc() không?

Không. Trình thu gọn giữ các dấu cách quanh dấu cộng và trừ bên trong giá trị, nên calc(100% - 30px) vẫn hợp lệ. Nó chỉ loại bỏ dấu cách quanh các ký tự cấu trúc như dấu ngoặc nhọn, dấu hai chấm và dấu chấm phẩy.

Chú thích có bị loại bỏ khi thu gọn không?

Chú thích thông thường bị loại bỏ để tiết kiệm dung lượng, nhưng chú thích giấy phép viết dưới dạng /*! ... */ được giữ lại, đây là quy ước chuẩn để giữ thông báo bản quyền.

CSS của tôi có được tải lên đâu không?

Không. Cả Làm đẹp và Thu gọn đều chạy hoàn toàn trong trình duyệt của bạn, nên các stylesheet của bạn không bao giờ rời khỏi thiết bị.

Nguồn

Nhúng công cụ này

Thêm công cụ này vào trang web của riêng bạn. Sao chép đoạn mã bên dưới; nó tự động cập nhật.

<iframe src="https://monu.tools/embed/vi/css-formatter" width="100%" height="640" style="border:1px solid #e5e5e5;border-radius:12px;max-width:680px" loading="lazy" title="Monu Tools"></iframe>

Công cụ liên quan