首页 > 软件开发 > HTML >

使用火狐浏览器开发者工具来调试html或者css

来源:互联网 2023-03-16 19:10:55 436

下面是记录下使用火狐浏览器简单调试css,html的情况,感兴趣的可以看一下。hEk办公区 - 实用经验教程分享!

使用火狐浏览器开发者工具来调试html或者csshEk办公区 - 实用经验教程分享!

方法/步骤

  • 1

    如下图所示的效果图中,因为css样式的宽没有设置好,所以最后一个div没有顶到最右边的边框。hEk办公区 - 实用经验教程分享!

    下面我们可以通过火狐浏览器来找到这个最佳的宽度(width值);hEk办公区 - 实用经验教程分享!

    使用火狐浏览器开发者工具来调试html或者csshEk办公区 - 实用经验教程分享!

  • 2

    然后按键盘上的F12来调出辅助的开发者工具。hEk办公区 - 实用经验教程分享!

    使用火狐浏览器开发者工具来调试html或者csshEk办公区 - 实用经验教程分享!

  • 2相关内容非法爬取自百度经验
  • 3

    开发者工具如下图,然后在查看器中选择相应的div,然后选中width的值(因为我们是要调整它)hEk办公区 - 实用经验教程分享!

    使用火狐浏览器开发者工具来调试html或者csshEk办公区 - 实用经验教程分享!

  • 4

    然后我们通过按键盘的向上键来增加width的值,向下是减值,每按一下就是增减1。hEk办公区 - 实用经验教程分享!

    使用火狐浏览器开发者工具来调试html或者csshEk办公区 - 实用经验教程分享!

  • 5

    如图所示,在按向上键增加width值的时候效果图越往右顶。当顶到右边的时候就是我们找的最佳值。hEk办公区 - 实用经验教程分享!

    使用火狐浏览器开发者工具来调试html或者csshEk办公区 - 实用经验教程分享!

  • 6

    但是你要注意,你的代码其实并没有被修改,所以我们还要将你得到width最佳值修改到你的代码中,保存。hEk办公区 - 实用经验教程分享!

    使用火狐浏览器开发者工具来调试html或者csshEk办公区 - 实用经验教程分享!

  • 以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!hEk办公区 - 实用经验教程分享!


    标签: CSSHTML浏览器

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码