2017-04-11 114 views
0

我是學習代碼的新手,我目前正在從樹屋等資源中學習。查看chrome中的源代碼

不過,我也想從其他開發者學習。我發現了幾個讓我感興趣的網站。

我想知道是否有任何的方式來查看源代碼,因爲它是寫的。 例如,當我通過單擊鼠標右鍵查看源代碼,然後查看源代碼時,它看起來全部在一行上壓扁在一起,而不是展開使代碼難以閱讀。

這裏是我談論的一個例子。 Example of code squashed together

我想知道是否有一個附加的或插件,將分離出 代碼成容易可讀塊,以便可以通過學習。

回答

0

在頁面右擊元素,然後選擇「檢查」以查看渲染的DOM - 這是不一樣的源代碼,但可能是一個更好的指標爲(現代網站)源可以內置通過原始HTML和JS的組合。

當您查看JS或CSS時,請在面板左下角尋找{}圖標 - 這樣可以很好地打印JS,同時讓您逐步瀏覽它。

您可以用CSS也使用這樣的:在工具的頂部

0

如果點擊Source選項卡並點擊左邊的文件,在彈出的開發工具窗口中點擊代碼窗口底部的大括號將其放入可讀格式