爲什麼Chrome開發人員工具有時不顯示CSS源代碼？

enter image description here 爲什麼Chrome開發人員工具有時不顯示CSS源代碼？

爲什麼Chrome開發者工具右下角有時顯示對CSS源的三角形（指示 - 如果你點擊它 - CSS源）如在我的截圖寬度 ...

但有時候不會......因爲在高度在我的屏幕截圖中。

換句話說，我怎麼知道什麼是設置高度= 575px？

來源

2013-10-17 hawbsl

看起來像這種情況下，該元素沒有指定的css高度被應用到它。它是由瀏覽器根據它所包含的東西的大小來計算的，例如容器div，瀏覽器窗口等。

來源

2013-10-17 16:00:04 wentz

謝謝。 Chrome的開發人員工具（或任何其他瀏覽器）中是否有任何功能可顯示如何確定此功能？ – hawbsl

我不知道有什麼辦法可以看到。一個很好的例子說明爲什麼它會如此艱難，請看你的評論的代碼。 'div'包圍着'span.comment-copy'。要計算div高度，需要考慮跨度的高度。在我的屏幕上，我將你的評論看成兩行，所以高度爲34px（兩行，行高爲17px）。我不確定開發工具有什麼直接的方式來描述它，但是如果有希望的話，有人已經或將要弄清楚。 – wentz

您在那裏選擇了「計算」選項卡，這意味着Chrome會告訴您所有部件的計算大小。這意味着你在那裏看到的並不是全部由css文件明確設置的，並且可以由元素的內容派生。

如果您希望只看到提供的CSS樣式，請選擇窗口頂部的「樣式」選項卡。

來源

2013-10-17 16:03:44 Don

謝謝。 Chrome的開發人員工具（或任何其他瀏覽器）中是否有任何功能可顯示如何確定「派生」設置？ – hawbsl

我不這麼認爲。這真的取決於你看內部元素，看看高度加起來等等。爲什麼這對你來說如此重要？因爲你可能採取了錯誤的方法來解決你的問題 – Don

重要，因爲我有兩個非常相似的頁面，其中一個的高度設置正確，另一個沒有。事實證明，正如你和另一個答案所解釋的那樣，這個高度是來源於其他父母的元素 – hawbsl

我遇到了同樣的問題，並且在此頁面登陸後，我發現由於我的css源文件已被縮小，開發工具無法檢測到該行，因爲顯然只有一行，所以這可能也是你問題的原因。

來源

2014-07-01 13:18:43 amallaki

爲什麼Chrome開發人員工具有時不顯示CSS源代碼？

回答

相關問題