[程式分析]GoogleChrome開發者工具(Developer Tools)
「Google Chrome Developer Tools 開發者工具」
網站製作者常會需要對網頁進行DEBUG工具，其實在Google Chrome中就已經內建了，在 Google Chrome 瀏覽器中提供了一個 DevTools 網頁開發人員工具，它可以讓網頁開發者非常方便的在上面測試網頁或除錯叫做Google Chrome Developer Tools 開發者工具
只要用Chrome開啟任一網頁按下「Ctrl+Shift+I」就會開始這個開發者工具。
滑鼠，按右鍵點「檢查元素」也可以開啟。
如上圖，會跳出一個Developer Tools開發者工具。這時候我們就可以來好好利用這個工具囉！
可以讓他固定在瀏覽器的下方，也可以獨立出一個視窗。只要點開發者工具視窗的右上角，第一個(視窗圖案)按鈕，就可以了。
可以直接對CSS樣式表更改參數,畫面就會直接可以預覽
將前面勾去掉即可暫時關閉語法效果
滑鼠在語法列點一下左鍵即可增加或修改
也支援自動輸入.只要KEY第一個字母.系統就會帶出相關的關鍵字語法.非常方便使用
![[網路資源] 免費的RWD自適應網頁版型下載(w3layout網站)](https://aweidesign.why3s.tw/wp2/wp-content/themes/lonesome-george/inc/script/imgsrc.php?src=https://aweidesign.why3s.tw/wp2/wp-content/uploads/2019/12/w3layer_01.jpg&w=235&h=170 "[網路資源] 免費的RWD自適應網頁版型下載(w3layout網站)")