CSS / HTML 格式化与压缩
CSS 与 HTML 一键美化或压缩,可选保留重要注释,并给出体积变化。
使用说明
- 四种模式:CSS 格式化、CSS 压缩、HTML 格式化、HTML 压缩。切换模式会自动换上对应的示例。
- CSS 格式化会把选择器与左花括号放在同一行、每条声明单独一行,
@media之类的嵌套规则逐层缩进。 - HTML 格式化按标签建树后重新缩进,
<img>等空元素不会多出闭合标签,<script><style><pre>里的内容原样保留。 - 压缩模式默认保留
/*! ... */与条件注释(<!--[if IE]>),这两类通常是版权声明或兼容代码,删了会出事。 - CSS 压缩时括号内的空白不会乱动:
calc(100% - 20px)如果压成calc(100%-20px)浏览器会直接判为无效。
HTML 格式化后页面排版变了?
这是 HTML 空白符的固有特性:格式化会在标签之间插入换行,而换行在渲染时等于一个空格。依赖「标签紧贴」的布局(例如行内元素之间不能有间隙)建议用压缩模式,或只用 CSS 格式化。
压缩会把 JS 也压了吗?
不会。script 里的内容只去掉首尾空白,不做压缩——压缩 JavaScript 需要完整的语法树,正则替换一定会踩坑,这类需求请用专门的构建工具。