Web Developer(Chrome Web開發(fā)工具插件)

Web Developer集成了各種各樣的 Web 開發(fā)工具，網(wǎng)絡(luò)程序的開發(fā)具有強大的輔助功能，比如調(diào)試CSS、清理Cookie等。安裝之后會在瀏覽器工具欄添加一個齒輪狀的小圖標(biāo)，點擊小圖標(biāo)之后就可以看到大量的 Web 開發(fā)工具，是網(wǎng)頁開發(fā)人員必備的 Chrome 開發(fā)者工具擴展插件！

Web Developer軟件特色

1、Disable禁用工具

可以暫時的屏蔽當(dāng)前頁面中的某些東東，如Ja vaScript腳本、緩存、mete自動重新定向、將網(wǎng)頁顯示為黑色(圖片除外)、禁用彈窗等。

2、Cookies工具

可以用此工具查看當(dāng)前頁面的Cookies信息，可以按不同的域名或路徑進(jìn)行查看，而且可以手工增加一個Cookies，這對于后臺網(wǎng)絡(luò)編程的開發(fā)調(diào)試來說是非常方便而得力的工具。

3、CSS樣式表工具

這是一個非常強大的工具基于CSS網(wǎng)頁布局有這個得力的助手，工作與學(xué)習(xí)都將變的非常簡單，可以控制CSS是否應(yīng)用，查看頁面的css文件，并進(jìn)行實時的編輯，并在瀏覽器窗口中立即反應(yīng)出編輯后的效果。

4、web developer 尺寸工具

Resize尺寸工具 我們可以用它來改變?yōu)g覽器窗口的尺寸，如果我們使用了1600*1200的分辨率，我們可以借助此工具來模擬1027*768的窗口效果。關(guān)于此工具的詳細(xì)介紹：Web Developer插件 Outline、Resize工具教程。

5、Tools工具

對于我們CSS網(wǎng)頁布局設(shè)計，它的最大功能在于將CSS及XHTML校驗工具整合在一起，可以點擊此工具中的校驗選項對當(dāng)前頁面進(jìn)行檢驗，它會自動鏈接到相關(guān)校驗頁面，并返回校驗結(jié)果。

安裝教程

1、在地址欄輸入chrome://extensions/打開開發(fā)者模式的開關(guān)。拖動 xxx、crx 文件到Chrome中間即可，其他chrome內(nèi)核的瀏覽器也可以直接拖入擴展管理中安裝；

2、把下載好的xxx、crx 的擴展名改為xxx、zip。

在地址欄輸入chrome://extensions/打開 開發(fā)者模式 的開關(guān)拖動 xxx、zip 文件到Chrome中間即可。

使用教程

1、首先在標(biāo)簽頁輸入【chrome://extensions/】進(jìn)入chrome擴展程序，解壓你在本頁下載的Web Developer插件，并拖入擴展程序頁即可。

2、安裝完成后，會彈出一個介紹界面，關(guān)閉后打開網(wǎng)頁試試效果吧。

3、進(jìn)入網(wǎng)頁后，點擊右上角的插件圖標(biāo)即可打開該插件窗口，通過該窗口，使用者可以將網(wǎng)頁中的樣式、js效果、圖片、cookie、形式標(biāo)簽以及網(wǎng)頁鏈接等進(jìn)行啟用或禁用。

4、同時，還能通過插件的CSS窗口對網(wǎng)頁的CSS代碼進(jìn)行編輯，當(dāng)然這個編輯是只對該瀏覽器有效的。

5、這款插件還能通過不同的頁面大小對網(wǎng)頁的響應(yīng)式設(shè)計進(jìn)行測試，當(dāng)然該軟件還有其他的許多功能，這需要使用者自行使用了。

6、若是想要對該插件的設(shè)置進(jìn)行一些調(diào)整，可以右鍵點擊Web Developer插件圖標(biāo)并選擇選項一欄進(jìn)入設(shè)置頁面，在該頁面中使用者可以對它的顏色樣式、尺寸、鏈接等功能進(jìn)行設(shè)置。