ปรับปรุง CSS ด้วยการเยื้องที่สะอาด หรือย่อเพื่อลดขนาดไฟล์ จัดการ media queries, calc() และ license comments
วิธีใช้ CSS Formatter
วาง CSS ของคุณลงในกล่องอินพุต
เลือก ปรับปรุง เพื่อจัดรูปแบบหรือ ย่อ เพื่อบีบอัด
เลือกขนาดการเยื้อง แล้วคัดลอกผลลัพธ์
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.
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.
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 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.
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.
คำถามที่พบบ่อย
ไม่ ตัวย่อเก็บช่องว่างรอบบวกและลบภายในค่า ดังนั้น calc(100% - 30px) ยังคงถูกต้อง ลบเฉพาะช่องว่างรอบอักขระโครงสร้างเช่น braces, colons และ semicolons
ความคิดเห็นปกติถูกลบเพื่อประหยัดพื้นที่ แต่ license comments ที่เขียนเป็น /*! ... */ ถูกเก็บไว้ ซึ่งเป็นแบบแผนมาตรฐานสำหรับการเก็บประกาศลิขสิทธิ์
ไม่ ทั้งการปรับปรุงและย่อทำงานทั้งหมดในเบราว์เซอร์ของคุณ ดังนั้น stylesheets ของคุณไม่ออกจากอุปกรณ์
ฝังเครื่องมือนี้
เพิ่มเครื่องมือนี้ลงในเว็บไซต์ของคุณเอง คัดลอกสคริปต์ด้านล่าง โดยจะอัปเดตให้เป็นปัจจุบันโดยอัตโนมัติ
<iframe src="https://monu.tools/embed/th/css-formatter" width="100%" height="640" style="border:1px solid #e5e5e5;border-radius:12px;max-width:680px" loading="lazy" title="Monu Tools"></iframe>เครื่องมือที่เกี่ยวข้อง
ปรับปรุง HTML ด้วยการเยื้องที่รู้จัก block หรือย่อ เนื้อหาของ pre, textarea, script และ style ถูกเก็บไว้
ปรับปรุงและทำให้ JavaScript สวยงามด้วยการเยื้องและช่องว่างที่สม่ำเสมอ ทำงานทั้งหมดในเบราว์เซอร์ของคุณ
แปลง CSV เป็นไฟล์ Excel .xlsx และ Excel กลับเป็น CSV ทั้งหมดในเบราว์เซอร์ของคุณ ทำงานได้ทั้งสองทิศทาง
สร้าง TypeScript interfaces จากตัวอย่าง JSON พร้อม nested types, arrays และ optional fields ทำงานในเบราว์เซอร์ของคุณ