使用开发者工具

Posted 2021-01-23 mrwangrd

浏览器开发者工具使用技巧

在前端的工作和学习过程中，往往会遇到以下问题：

图片无法加载、样式不正确、JS 无法执行、无法调试手机页面、与后台对接出错等。

那么我们排查和处理这些问题的方法就是学会使用浏览器开发者工具。

使用开发者工具

1. 首先，我们打开 Chrome 浏览器，点击右上角的菜单栏按钮，然后选择更多工具的下的开发者工具。

当然，也可以直接使用快捷键Ctrl + Shift + I或者F12。

1. 右上角有三个点号，我们点击一下，可以调整开发者工具相对于页面的位置，默认为“Dock to right”。