Visualiseeri CSS-stiilid CSS-statistikaga
Kas olete kunagi mõelnud, kui palju CSS-reegleid on stiilitabelis? Või olete kunagi tahtnud näha a visuaalne esitus of kõik värvid kasutatakse ühes CSS-failis? Koos CSS statistika, saate ühendada mis tahes veebisaidi ja tõmmake hulk toor-CSS-andmeid oma uudishimu rahuldamiseks.
Ja see veebirakendus läheb nii palju sügavamale kui lihtsalt kuvab kõik stiilitabeli värvid. Saate visualiseerida kõik z-indeksi väärtused, kõik fondi suurused, kõik meedia päringud ja isegi vaata a visuaalse spetsiifilisuse graafik.
See app hõlmab nii palju, et see on praktiliselt võimatu tarbida kõike ühes istungil. See annab teile tohutu ülevaate kõigist veebisaitidest näidata, mis on nende stiililehel.
Alustamiseks külastage CSS Stats'i veebisaiti ja ühendage mis tahes URL looda sa. Võite valida ka mitmete soovitatud saitide hulgast, nagu Facebook, Apple ja Pinterest (muu hulgas).
Tulemuste lehel näete kogu CSS-faili suurus kilobaitides koos nimekirjaga kõige sagedamini kasutatavad omadused ja deklaratsioonid. See kõik ilmub ühe pika numbri loendina, nii et see võib kõigepealt segadust lugeda.
Aga mida rohkem seda rakendust kasutate, seda lõbusam on see! Siin on a kõike leiad statistika lehelt:
- Kokku # omadused, selektorid, ja eeskirjad
- Kõik fondi värvid näidete ja kuue koodiga
- Kõik taustavärvid näidete ja kuue koodiga
- Kõik fondi suurused näidetega
- Nimekiri fontide perekonnad
- Kõigi nimekiri z-indeksi väärtused
- Vöötkaart CSS-deklaratsioonid kokku
- Spetsiifilisuse graafik
- Kokku reegli suurus
- Kõik meedia päringud
- The toores CSS-kood koos URL-lingid Euroopa CSS-faile
CSS statistika on piisavalt tark, et tõmmata kõik CSS-failid ja ühendada need andmed kokku. Arendajad panid selle asjaga palju pingutama, et see toimiks õigesti.
Ja ekstreemne osa on täielik GitHub repo koos kogu projekti lähtekoodi. Nii saate selle alla laadida taaskäivitage see oma serverisse (kohapeal või muul viisil), et mängida, kui soovite koodiga kaevata.
Sul on võimalus üksikute CSS-failide tõmbamine või kõigi stiililehtede analüüsimine ühes domeenis. Selle tööriista õppimisest on nii palju õppida ja see pakub sügavamat ülevaadet arendajatele, kes sattuvad asjatutesse üksikasjadesse.
Enda testimiseks külastage lihtsalt CSS statistikat ja ühendage veebisait. Sul on üllatunud, kui palju andmeid on saadaval ja kui palju saate sellisest lihtsustatud vahendist õppida.