Podroben CSS inšpektor na vsakem mestu s CSSPeeper za Chrome

Običajna plošča Chrome DevTools je nora močna. Omogoča vsakomur, da se potopi globoko v katerokoli stran, da preuči postavitev spletnega mesta, CSS in celo HTTP glave, če je to potrebno.

Z inšpektorjem CSS DevTools lahko naredite veliko. Vendar pa nima jasne GUI plošče in to je ena stvar, ki bi jo imel vsak razvijalec.

Oglejte si CSSPeeper, brezplačno razširitev za Chrome, ki dodaja inšpektorja GUI v brskalnik. Omogoča vam, da preučite lastnosti CSS katerega koli elementa na kateri koli strani, čeprav je trenutno zgrajena samo za Chrome.

Ko ste enkrat namestili obiščite spletno stran in kliknite glavni gumb razširitve v vrstici z dodatki za Chrome. Novo okno inšpektorja se prikaže na vrhu spletne strani s podrobnostmi o vsakem glavnem elementu.

Ko brskate po mestu, lahko kliknete kateri koli element, ki ga vidite s pikčastim obrisom. To lahko vključuje gumbe, dele strani, glave, elemente navigacije, ki jih imenujete.

Od tam boste dobili celotnega inšpektorja s podrobnostmi o tipografiji, izbiri barv in slogi pisav. To je odličen način povlecite sloge neposredno s spletne strani ne da bi sami kopali v kodo CSS.

CSSPeeper vam celo dovoljuje izberete sorodne barve z vgrajenim izbirnikom barv in generator barvne sheme. Slike lahko izvozite iz strani, izdelate svoje barvne sheme in uporabite jih v svojih modelih s programom Photoshop ali Sketch.

Jaz predvsem priporočam to razširitev za oblikovalce namesto razvijalcev, saj je veliko bolj prijazen vtičnik, ki privlači CSS in preoblikuje kodo v enostaven za branje podatkov.

Toda ta plugin lahko pomaga tudi razvijalcem! Res je močno inšpekcijsko orodje za vse vrste CSS.

Oglejte si domačo stran CSSPeeperja, če želite izvedeti več o tem, kaj lahko stori. Glavna stran vsebuje tudi povezavo do trgovine Chrome, tako da lahko brezplačno namestite razširitev in jo vzamete za preizkus.