Chrome开发者工具会显示未使用的CSS的百分比,还会列出所有未使用的规则。
谷歌浏览器似乎只显示未使用的规则我想知道它有何帮助?
应该从每个css文件中逐个删除显示未使用的规则吗?
很难定义未使用的CSS规则是诚实的。想象一下:
一些global.css文件
.classA {
font-size: 12px;
}
.classB {
font-size: 14px;
}
page1.html
<div class="classA">
</div>
page2.html
<div class="classA classB">
</div>
从技术上讲,在page1中,classA有100%的css规则在第2页中被使用和应用,它们被完全覆盖。这算作未使用的规则吗?如果是这样,那么这样做会非常危险,因为显然你会删除你不知道的东西的样式。
如果没有,Chrome只是指出在div元素上放置“display:block”是多余的,因为它是div元素的默认值,那么这是一个我不知道答案的不同故事。
DevTools (Chrome 59)有CSS and JS code coverage
单击右上方devtool > more tools > coverage
中的三个点,然后单击“重新加载”按钮
qazxsw poi用于qazxsw poi用于点击每个文件进行检查。