入门的HTML,css和Javascript调试技巧

本文介绍一些入门的HTML,css和Javascript调试技巧。

希望能让初学者有所收获，少走一点弯路。

个人推荐Chrome作为开发工具（FF可以使用FireBug，IE8和之后的版本也有自己的调试工具）

1.HTML的调试

将鼠标放在任意元素上，右键Inspect Element，即可查看该元素的HTML内容。（也可以通过F12打开开发者工具）

　　


　　效果如下

　　


在Elements面板中 将鼠标放在任意元素上，HTML界面上对应的元素会被选中
右击元素，可以直接修改或者是移除元素，修改后的元素效果会马上反应在页面上

2.CSS的调试

在开发者工具的右侧面板可以找到对应的CSS调试框

　　


Styles分类下可以看到该元素的详细样式，而且你还可以直接修改它 （点击一个样式，或者双击空白处）
样式的右侧会提示该样式来自哪个文件的哪一行
被加了删除线的样式是无效的，或者被覆盖了
将鼠标放在样式上的时候，右侧会出现一个CheckBox，用于启用和禁用当前样式