Firefox擴展以顯示內嵌css類或id定義？

我使用Firebug和Web Developer Firefox擴展。我正在尋找的一個功能，以及我不確定它們是否存在於這些擴展中的情況是，當我查看網頁源時，我想單擊一個類或id名稱，並在其中顯示該類或id的定義。不是CSS繼承層次結構。就在特定的類或ID（如果存在）Firefox擴展以顯示內嵌css類或id定義？

例如：

..... 我點擊「標題」，我得到的CSS定義，或者它告訴我有沒有。我想篩選CSS樹層次結構來顯示那個類。

任何擴展可以做到這一點？

來源

2009-06-01 Abdu

究竟做你的意思「它顯示了class和id的定義」？例如。你想要的只是與「#header」完全匹配的CSS選擇器，還是隻包含「#header」的選擇器？ – mercator 2009-06-26 11:16:29

Firebug can do that。打開HTML標籤，選擇你感興趣的元素。在style-tab下的firebug窗口的右邊框中查找。在那裏你會看到應用於元素的每種樣式都是由id，class或任何其他類型的選擇器組成的。您還可以查看佈局標籤以查看選定元素的偏移量，邊距，填充和寬度。

舉例來說，這裏在計算器上，當我點擊體 - 元素，我看到以下內容：

body {   /* File: all.css?v=3496 (row 1) */ 
    background:#FFFFFF none repeat scroll 0 0; 
    color:#000000; 
    font-family:Arial,Helvetica,sans-serif; 
    font-size:80%; 
    text-align:center; 
} 
body {   /* File: all.css?v=3496 (rad 1) */ 
    line-height:1; 
} 
/* + A lot of reset styles for all elements */

來源

2009-06-01 16:24:40 PatrikAkerstrand

這不是我想要的。我確實提到過我不想看到css層次結構，這就是Firebug顯示的內容。我想點擊類名，而不是元素。 – Abdu 2009-06-01 18:11:34

這不從源頭上做到這一點（我不相信）但是在頁面上做。 CSSViewer會提供幫助嗎？

https://addons.mozilla.org/en-US/firefox/addon/2104

來源

2010-03-31 19:47:36

Firefox擴展以顯示內嵌css類或id定義？

回答

相關問題