我是CSS新手。是否有一个工具可以帮助调试应用于网页的CSS样式。
当页面上的某些元素没有按原样出现时,如何通常调试CSS并解决问题?现在,我必须逐个注释掉CSS声明,以了解样式的显示方式。
答案 0 :(得分:15)
您在Firefox中使用Firebug,这使得调试变得更加容易。
答案 1 :(得分:15)
通过浏览器:
Firefox 有一个名为Firebug的插件模块。它易于安装且功能强大。与Firefox的“Web Developer”结合使用会更好。
Internet Explorer 有一个开发人员工具栏,它不如Firebug好,但足以检查IE中仍然有效的内容。此外,还有一个名为IE DOM检查器的工具。还有一个版本的Firebug for IE caled Firebug Lite。
Google Chrome 附带类似于Firebug的内置工具。请参阅地址栏右侧下拉菜单中的'tools-> developer'选项。这允许您查看每个元素使用的css规则。它还具有Javascript调试支持。
Safari 使用名为Web Inspector的工具。
Opera 有一个名为Dragonfly的内置实用程序。
答案 2 :(得分:5)
Opera中内置DragonFly。
答案 3 :(得分:3)
您可以使用适用于Firefox的Firebug插件。它对CSS非常有用。 您可以从样式中动态打开和关闭样式和字段。太棒了。
答案 4 :(得分:3)
如果您没有使用Firefox,现在可以获得可以在IE等中使用的Firebug Lite。
答案 5 :(得分:2)
Safari’s Web Inspector或Firebug for Firefox等Web开发人员工具可以帮助您调试CSS。这些工具可以显示应用于特定元素的规则级联,并允许您更改或禁用特定属性。
答案 6 :(得分:0)
首先使用Firefox开发和测试您的CSS,然后切换到其他浏览器来测试您的代码。这是一种普遍接受的方法恕我直言。 Firebug非常棒,但如果你将它与Web Developer插件结合使用,效果会更好。
有一个很棒的site值得一试,有很多关于CSS和HTML开发的信息。
答案 7 :(得分:0)
当您需要调试IE特定的问题时。我听说人们告诉IE DOM inspector并不是太糟糕。您还可以尝试this post中描述的工具。
答案 8 :(得分:0)
现在,您可以在大多数现代浏览器中使用我新发布的工具!