2010-11-24 46 views
0

不知道是否有人可以提供一些建议。基本上,这是我不时遇到的东西 - 我正在学习使用萤火虫进行调试,并试图追踪在复杂的一群WordPress的/花哨的框文件中设置样式属性的位置。基本上,我试图让fancybox自动调整到元素的宽度,我知道fancybox选项来启用此功能,但整个盒子似乎覆盖了一个固定的宽度,这是我找不到任何地方的样式表。在Firebug中调试

element.style { 
border-width:10px; 
height:84px; 
width:987px; 

现在,这不会对在Firebug右侧关联的样式表,所以我假设这意味着它的计算上的JS/PHP的地方飞?

我在追寻的是如何追踪它被设置的位置的指针,以及如何使用萤火虫识别它是否被设置在样式表之外?这是我可以成为一个更好的调试器:)谢谢你的期待。

回答

1

在Mozilla浏览器中使用萤火虫点击左上角的箭头图标并选择页面上的任何控件。它会在右侧显示他们的风格(css)。在这里您可以进行任何更改,并且会在浏览器中显示。

认为它会对你有帮助。

+0

嗨,谢谢你的回答 - 我认为虽然我已经使用它来处理样式,但是这个特定问题的问题在于它似乎没有关联样式表(当在右侧的面板中查看时在单击tha箭头后显示样式),再加上它说element.style {}让我认为它是在js或php中动态设置的,而不是硬编码到样式表中。我想通过使用萤火虫来识别发生在哪里,有没有办法做到这一点?干杯。 – frazzle 2010-11-24 10:43:46

0
  1. 首先找到元素
  2. 一旦你这样做,触发事件,你会看到当element.style被指定为样式信息的来源变化
0

,这意味着风格是内联的(即指定为标签的属性)。

E.g.

<div style='border-width:10px;height:84px;width:987px;>This is a box</div> 

如果你不能看到源代码,很可能它已经被一些JavaScript

添加使用的Firefox网页开发者的插件,你不仅可以查看源代码,你可以查看生成的源代码,它会在之后给出源任何javascript已对其执行操作。

+0

嗨,我可以看到之前的来源,以及计算出的风格 - 我看到的是如果有办法确定元素正在应用哪个文件/行号,如果您明白我的意思。目前,我只是通过手动查看所有文件来了解我是否可以对其应用的位置有所了解。干杯 – frazzle 2010-11-24 11:46:24