html - 查看源代码的最佳 Firefox/Chrome 插件？

Question

我发现自己看到了按钮、输入、标题等内容。并想要代码，以便我可以引用它们并使我的基本设计看起来更好。我总是试着改变它一点，我不喜欢偷别人的设计。

仅从浏览器查看页面源代码非常草率，通常难以阅读。我尝试使用 Firebug，但发现一个大问题。它没有显示所有的 CSS。

例子
Firebug 只会显示:

box-shadow: 0 14px 10px -12px rgba(111,112,114,0.8);  

当完整代码为:

box-shadow: 0 14px 10px -12px rgba(111,112,114,0.8);  
-webkit-box-shadow: 0 14px 10px -12px rgba(111,112,114,0.8);  
-moz-box-shadow: 0 14px 10px -12px rgba(111,112,114,0.8);  

如果省略了 moz 和 webkit。

Answer 1

我可以说说 Chrome Inspect 工具的经验，在调试页面元素时，浏览器会自动忽略并且不会显示无效的属性或样式，但是如果您查看实际的页面源代码(或 css)，您的样式会在那里。

我认为如果 Firebug 不显示这些样式，则意味着 Firefox 忽略了它们，在这种情况下，您使用的是 -moz-box-shadow 但 Firefox 使用 box-shadow 渲染元素。