1 OctoTree: 把 Github 打造成 Vscode 編輯器

此擴(kuò)展增強(qiáng)了Github代碼的審查和探索。除此之外，還提供了一些功能，例如暗模式(我的最愛)，代碼字體設(shè)置，書簽，側(cè)邊欄停靠等。Octotree感覺很像Github中的Visual Studio Code。

 

 

2.Wappalyzer: 一鍵分析網(wǎng)站的前端技術(shù)

此瀏覽器擴(kuò)展是一個(gè)技術(shù)概述，它向您顯示構(gòu)建哪些網(wǎng)站和Web應(yīng)用程序。好奇網(wǎng)站使用什么技術(shù)，框架，Javascript庫等來構(gòu)建網(wǎng)站或Web應(yīng)用程序?只需使用Wappalyzer就夠啦。

 

 

3.Web Developer：

擴(kuò)展名很奇怪。不過，所做的事情絕非不可思議。太奇妙了。該瀏覽器擴(kuò)展添加了一個(gè)小工具欄按鈕，其中包含與圖像，表單等有關(guān)的各種Web開發(fā)人員工具。

 

 

4.Windows Resizer

響應(yīng)式網(wǎng)頁設(shè)計(jì)是開發(fā)中很重要的方面之一。此擴(kuò)展可以幫助您調(diào)整瀏覽器窗口的大小，以模擬各種設(shè)備分辨率。它可以幫助Web設(shè)計(jì)人員和開發(fā)人員在不同的瀏覽器分辨率下測試其布局。

分辨率列表是完全可定制的(添加/刪除/重新排序)。

您可以設(shè)置窗口的寬度/高度，窗口的位置，預(yù)設(shè)圖標(biāo)(電話，平板電腦，筆記本電腦，臺(tái)式機(jī))，甚至可以選擇將新尺寸應(yīng)用于整個(gè)窗口或僅應(yīng)用于視口。

它還具有可自定義的全局鍵快捷方式，這是一個(gè)導(dǎo)出設(shè)置并將其導(dǎo)入另一臺(tái)計(jì)算機(jī)的選項(xiàng)!如此驚人。

這是它的外觀 這是將其添加到瀏覽器的

 

 

5.Check My Links: 查看網(wǎng)站鏈接

此瀏覽器擴(kuò)展程序是一個(gè)鏈接檢查器，可在您的網(wǎng)頁中進(jìn)行爬網(wǎng)并查找斷開的鏈接。它非常適合在具有多個(gè)鏈接的Web應(yīng)用程序或網(wǎng)站上工作的Web開發(fā)人員。它減輕了手動(dòng)搜索斷開鏈接的壓力。它為您突出顯示了已斷開，有效，重定向到另一個(gè)頁面等的鏈接。非常方便。

 

 

6，What Font: 查看網(wǎng)站字體

知道在Web應(yīng)用程序和網(wǎng)站上使用什么字體從未如此簡單。使用此擴(kuò)展程序，您可以將鼠標(biāo)懸停在它們上來檢查Web字體，還可以檢測用于提供Web字體的服務(wù)。支持Typekit和Google Font API。

 

 

7.ColorZilla：UI取色器

這是一個(gè)瀏覽器擴(kuò)展，可協(xié)助Web開發(fā)人員和圖形設(shè)計(jì)師完成與顏色相關(guān)的任務(wù)。只需將鼠標(biāo)懸停在網(wǎng)站或應(yīng)用程序中的某個(gè)元素上，即可獲取與其顏色相關(guān)的所有信息。它包括拾色器，滴管，漸變生成器等等。

它與Color By Fardos非常相似。

 

 

8. Web開發(fā)人員清單：此瀏覽器擴(kuò)展有助于分析和檢查其網(wǎng)站或Web應(yīng)用程序是否違反了Web設(shè)計(jì)中的最佳實(shí)踐。

這是它的外觀 這是將其添加到瀏覽器的直接鏈接：https : //chrome.google.com/webstore/detail/web-developer-checklist/iahamcpedabephpcgkeikbclmaljebjp?hl=zh-CN

 

 

9.CSS Viewer

此瀏覽器擴(kuò)展程序非常簡單，只需將鼠標(biāo)懸停在其上即可訪問元素的CSS屬性。它的功能與Code Cola擴(kuò)展非常相似。

 

 

10.Pesticide: CSS邊框可視化

這是在CSS中可視化框大小的絕對最簡單的方法。不相信我嗎 看看這個(gè)。使用Pesticide，您會(huì)看到每個(gè)元素都是一個(gè)帶有邊框的盒子。查看邊框，邊距，填充等如何影響元素