最佳Firefox/Chrome插件查看源代碼？

我發現自己看到像按鈕，輸入，標題等內容。並希望代碼，所以我可以參考他們，使我的基本設計看起來更好。我總是試圖改變它，我不喜歡偷別人的設計。最佳Firefox/Chrome插件查看源代碼？

僅從瀏覽器查看頁面源代碼非常瑣碎，通常很難閱讀。我嘗試使用Firebug，但我注意到一個巨大的問題。它不顯示所有的CSS。

例
螢火蟲只會顯示：

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。

來源

2012-08-02 Tyler Hughes

Firebug只顯示'box-shadow'，因爲那是firefox正在使用的那個。如果你想要完整的源代碼，只需使用'view source':) – Vatev 2012-08-02 06:02:10

我可以在Chrome Inspect工具中使用經驗，在調試瀏覽器自動忽略的頁面元素時不會顯示無效的屬性或樣式，但是如果您查看實際的頁面源代碼（或CSS），您的樣式將會在那裏。

我認爲，如果Firebug不顯示這些樣式，這意味着Firefox忽略它們，在這種情況下，您使用的是-moz-box-shadow，但Firefox使用box-shadow來呈現元素。

來源

2012-08-02 06:05:28 rvil

下載任何瀏覽器的最新版本，你絕對看到所有的CSS。

隨着督察在Chrome中，你可以看到甚至像:hover:active等

來源

2012-08-02 05:59:46 Ibu

不同狀態爲什麼不直接使用的檢查是內置的Chrome瀏覽器元素嗎？我每天都在使用它，並且喜歡它。

我也用「stylebot」給我看一些風格的網站，但我只用它來風格的網站（客戶方），我覺得需要一些固定的，像製作按鈕較大，等等

來源

2012-08-02 06:00:38 Xhynk

最佳Firefox/Chrome插件查看源代碼？

回答

相關問題