如何找出 ASP .Net 网页元素的样式来自何处？

Question

我有一个困境。我的 Web 应用程序（C#、.Net 3.0 等）有主题、CSS 表，当然还有内联样式定义。现在有很多厨师在汤里添加东西。毫不奇怪，所有这些结果导致我的页面有时会出现奇怪的样式。

我确信所有这些样式都以分层方法应用（尽管我不确定该顺序）。问题是每种样式都作为“透明”图层应用，它只是掩盖了它所应用的内容。我认为这是一个好主意，因为您可以为整体指定样式，然后根据需要单独使用它们。不幸的是我无法判断样式实际上来自哪一层。

我可以通过在所有层显式表达样式来解决这个问题，但这会变得庞大且难以管理，并且页面在 80% 的时间内都可以正常工作。我只需要弄清楚这 20% 的百分比是从哪里来的。

Answer 1

恕我直言，Firebug 将是你最好的选择。它会告诉您样式来自哪个文件，您可以单击文件名立即传输到文件中的相关行。

笔记：你可以打 控制键+转移+C 在任何页面上用鼠标选择和检查元素。

Answer 2

以下是如何使用 Firebug 找出元素从何处获取其样式的快速视频。

http://screencast.com/t/oFpuDUoJ0

Answer 3

在 Firefox 中使用 DOM 检查器、firebug 或检查 this。
在 IE 中，使用 IE 开发工具栏（或者，也许更好， 萤火虫精简版)
在 Google Chrome 中，使用内置的“检查元素”功能

Answer 4

使用 IE 开发者工具栏 您可以选择一个元素（通过“通过单击选择元素”或单击 DOM 树视图中的节点），然后在“当前样式”窗格中右键单击一行并选择“跟踪样式”。

其他工具也有类似的功能。

Answer 5

解决复杂 CSS 问题的关键是找出导致奇怪外观的原因。最简单的查找方法是有选择地注释掉样式表，直到找到可以解决问题的样式表。然后启用样式表并有选择地注释掉规则，直到找到导致问题的规则。如果需要知道什么优先于什么，CSS中级联的细节有详细介绍这里 与单个规则的实现不同，这在浏览器之间相当一致。

然而，如果您完全避免内联样式并拥有一组精心设计的样式表，每个样式表都有一个逻辑功能并且您了解其所有规则，那就更好了。出于同样的原因，您不会将服务器端代码以随机顺序放入随机文件中 - 我们