先下載 firefox:
http://www.mozilla.com/firefox/
之後再安裝
https://addons.mozilla.org/firefox/60/
接下來就是很強的功能介紹了, 一般我們在寫 client side 的 html, javascript這些tag或script, 最麻煩的就是debug的部分, 然而, 用 firefox 加上一個 web developer extesion 後, 你會發現一切都改觀了, 無論是 form 的變數, input text 密碼顯示, 長度取消, readonly 改為可寫入, 隨時修改html source改變顯示結果, cookie 變數, 變數值, div, iframe 等區域顯示, javascript 除錯, validation css 及html的功能, 都可以很容易的在一個瀏覽器內實現, 果然名如其功能, 就是好用的 [web developer]. 無論是程式設計人員或是網頁美工人員, 都是不可或缺的一個好工具. 不過 firefox 就是 layout 和 ie 不太一樣, 為了滿足廣大 ie 的用戶, 建議是搭配 firefox 寫 html及script配合 ie preview, 應該是最理想的方式囉….
另外像是 ie 常常會有 view source 時的問題(開不起來)的這種狀況, 在 firefox 是不會發生的, 而且source還會有美觀的字型顏色來呈現, 方便寫 code 的人看哦.
動態 disable 的功能:
cookie的功能:
css的功能:
form的功能(很精彩吧):
outline的功能, 能標出你想看的區域:
validation的工具, 還有 java, javascript的console:
利用outline的block element功能秀出的網圖範例:
另外內附的 dom 檢視器可以檢視完整的html內元素樹狀圖, 也非常值得一用.
中文版本的部分,
firefox: http://www.moztw.org/
該extension可以到這裡下載: