Podrobný inšpektor CSS na každom webe s nástrojom CSSPeeper pre prehliadač Chrome

Pravidelný panel Chrome DevTools je šialený výkon. Umožňuje, aby sa niekto ponoril hlboko do ľubovoľnej stránky a študoval rozloženie stránok, CSS a dokonca hlavičky HTTP, ak je to potrebné.

S inšpektorom služby DevTools CSS môžete urobiť veľa. Ale nemá jasný panel GUI a to je jedna vec, ktorú by každý vývojár rád.

Pozrite sa na CSSPeeper, bezplatné rozšírenie prehliadača Chrome, ktoré pridá tento inšpektor GUI do vášho prehliadača. Umožňuje vám študovať vlastnosti CSS ľubovoľného prvku na ľubovoľnej stránke, aj keď je práve teraz vytvorený pre prehliadač Chrome.

Po nainštalovaní ste práve navštívte webovú stránku a kliknite na hlavné tlačidlo rozšírenia v paneli doplnkov Chrome. Na hornej strane webovej stránky sa zobrazí nové okno s podrobnosťami o každom hlavnom prvku.

Počas prehliadania stránok môžete kliknúť na ľubovoľný prvok, ktorý vidíte s bodkovaným obrysom. Môže to zahŕňať tlačidlá, sekcie stránok, hlavičky, navigačné položky, ktoré ste mi pomenovali.

Odtiaľ dostanete celý inšpektor s podrobnosťami o typografii, voľbách farieb a štýloch písma. Je to skvelý spôsob stiahnite štýly priamo z webovej stránky bez toho, aby ste sa do kódu CSS dostali do seba.

CSSPeeper vám dokonca umožňuje vyberajte súvisiace farby so zabudovaným výberom farieb a generátor farebných schém. Môžete exportovať obrázky zo stránok, vytvárať vlastné farebné schémy a použite ich vo svojich vlastných modeloch pomocou programu Photoshop alebo Sketch.

Ja predovšetkým odporúča toto rozšírenie pre návrhárov namiesto vývojárov, pretože je to oveľa viac dizajnérov priateľský doplnok, ktorý ťahá surový CSS a transformuje kód na ľahko čitateľný kus dát.

Ale tento plugin môže tiež pomôcť vývojárom! Je to naozaj a výkonný nástroj kontroly lokality pre všetky typy CSS.

Pozrite sa na domovskú stránku služby CSSPeeper, aby ste sa dozvedeli viac o tom, čo môže urobiť. Hlavná stránka obsahuje aj odkaz na obchod Chrome, aby ste mohli bezplatne nainštalovať rozšírenie a vyskúšať ho.