【Webflow 入門教學】 無須懂程式碼，打造令人驚豔的網站！

Web 入門是一系列簡潔的文章，介紹網頁開發的實用範例。 你將運用相關工具建構簡易網頁並發布自己的程式碼。

除了從 elements 可以用搜尋找到程式碼以外，我們也能從網頁上去點選我們想要確認的程式碼內容。 我們可以到開發者工具的左上角，會看到這個「檢查箭頭」。

Visual Studio Code 網頁版提供完全在瀏覽器中執行的免費零安裝 Microsoft Visual Studio Code 體驗，可讓您快速安全地瀏覽網站程式碼並進行輕量型程式碼變更。

學會觀察 HTML 原始碼是一件很重要的事，未來不論是要設計動態網頁、或是實作網頁爬蟲，都必須要知道 HTML 的網頁結構以及用了哪些網頁元素，甚至還可以從 HTML 原始碼裡，發現一些這個網站不為人知的小秘密，或是一些只能從原始碼看到的小驚喜。

當你造訪網頁時，網站會將 HTML 程式碼傳送至瀏覽器。這組原始碼通常含有額外資源，例如必須載入的指令碼，以及可能變更網頁程式碼的指令碼。 以滑鼠右鍵按一下「顯示原始碼」之後，通常只會顯示傳回給瀏覽器的原始網頁程式碼，不會包含後來載入並執行的指令碼和其他資源。但在許多情況下 (尤其是要對網頁進行疑難排解時)，你會需要查看瀏覽器上轉譯後的最終網頁程式碼，其中包含所有已載入的資源和所有已執行的指令碼。例如： • 搜尋驗證時使用的 Google Analytics (分析) 或 Google 代碼管理工具的

除了檢查程式碼之外，此選項對於了解有關 Web 程式設計的更多資訊、了解特定網站的工作原理甚至檢測可能的錯誤或問題非常有用。

使用 W3Schools 線上程式碼編輯器，您可以編輯 HTML、CSS 和 JavaScript 程式碼，並在瀏覽器中檢視結果。 左側的視窗是可編輯的 - 編輯程式碼並單擊“執行”按鈕，在右側視窗中檢視結果。