1. 打开开发者工具：在Chrome浏览器的右上角，点击三个垂直点（或按F12键），然后选择“开发者工具”。
2. 设置断点：在开发者工具中，点击左侧的“断点”按钮，然后点击你想要断点的代码行。这样，当你的代码执行到这一行时，浏览器会暂停并显示一个红色的圆圈。
3. 查看控制台：在开发者工具中，点击“控制台”按钮，可以查看当前页面的源代码、变量值等信息。
4. 检查网络请求：在开发者工具中，点击“网络”按钮，可以查看当前页面的网络请求和响应信息。
5. 调试JavaScript：在开发者工具中，点击“调试”按钮，可以开始调试JavaScript代码。可以使用断点、单步执行、查看变量值等功能来调试代码。
6. 查看CSS样式：在开发者工具中，点击“样式”按钮，可以查看当前页面的CSS样式。可以使用颜色、字体、布局等选项来修改样式。
7. 查看元素属性：在开发者工具中，点击“元素”按钮，可以查看当前页面的元素属性。可以使用颜色、大小、位置等选项来修改元素的属性。
8. 查看DOM结构：在开发者工具中，点击“DOM”按钮，可以查看当前页面的DOM结构。可以使用缩放、平移等选项来查看和编辑DOM元素。
9. 使用快捷键：熟悉开发者工具中的快捷键，可以提高调试效率。例如，Ctrl+Shift+I（单步执行）, F10（刷新）等。
10. 保存和导出代码：在开发者工具中，点击“文件”菜单，可以选择保存当前页面或导出为HTML文件。
以上就是一些常用的Google浏览器开发者工具的调试与操作技巧，希望对你有所帮助。
