如 demo 所示,一旦你打开了 Coverage 面板,你可以在 Sources 面板打开一个源文件。当文件打开时,你将注意到 CSS 文件中每条样式右侧都有绿色或红色的线,指示样式是否在当前页面被应用。
你的浏览器开发工具是 CSS 编辑和调试的宝库。当你将以上建议与 Chrome 的功能例如 —— Workspaces(允许你把在开发者工具所做的变更保存到本地文件)—— 结合,整个调试过程会变得更加完整。
我希望这些技巧与建议将提升你在未来的项目中编辑与调试 CSS 的能力。
以上就是16 个CSS开发中需要了解的DevTools技巧的详细内容,更多请关注其它相关文章!