Visuaalinen CSS-tyylitaulukko, jossa on CSS-tilastot
Oletko koskaan miettinyt, kuinka monta CSS-sääntöä on tyylitaulussa? Tai oletko koskaan halunnut nähdä visuaalinen esitys of kaikki värit käytetään yhdessä CSS-tiedostossa? Kanssa CSS-tilastot, voit liittää minkä tahansa verkkosivuston ja vedä joukko raaka CSS-tietoja tyydyttää uteliaisuuttasi.
Ja tämä web-sovellus menee niin paljon syvemmälle kuin vain näyttää kaikki tyylitaulukon värit. Voit visualisoida kaikki z-indeksiarvot, kaikki fonttikoot, kaikki median kyselyt ja jopa nähdä a visuaalisen spesifisyyden kuvaaja.
Tämä sovellus kattaa niin paljon, että on käytännössä mahdotonta kuluttaa kaikkea yhdessä istunnossa. Se antaa sinulle valtavan yleiskuvan kaikista sivustoista juuri esittelee, mitä niiden tyylitaulukossa on.
Käynnistä CSS-tilastot -sivusto ja kytke kaikki URL-osoitteet sinä toivot. Voit myös valita useita ehdotettuja sivustoja, kuten Facebook, Apple ja Pinterest (mm.).
Tulossivulla näet CSS-tiedoston koko kilotavuina, sekä luettelo yleisimmin käytetyt ominaisuudet ja ilmoitukset. Kaikki tämä näkyy yhtenä pitkänä luettelona numeroista, joten se voi olla hämmentävää lukea ensin.
Mutta mitä enemmän käytät tätä sovellusta, sitä hauskempaa se saa! Tässä on a luettelo kaikesta löydät tilasivulta:
- Yhteensä # ominaisuudet, valitsimet, ja säännöt
- Kaikki fontin värit esimerkkejä ja heksakoodeja
- Kaikki taustavärit esimerkkejä ja heksakoodeja
- Kaikki kirjasinkokoja esimerkkejä
- Luettelo fonttiperheet
- Luettelo kaikista z-indeksiarvot
- Pylväskaavio yhteensä / ainutlaatuiset CSS-ilmoitukset
- Spesifisyysgraafi
- Kaikki yhteensä sääntöjen koko
- Kaikki median kyselyt
- raaka CSS-koodi kera URL-linkit että yksittäisiä CSS-tiedostoja
CSS-tilastot ovat tarpeeksi älykkäitä, jotta kaikki CSS-tiedostot ja yhdistää nämä tiedot yhteen. Kehittäjät panostivat tähän asiaan paljon, jotta se toimisi oikein.
Ja ylimääräinen mahtava osa on täydellinen GitHub-repo lähdekoodin koko projektille. Voit siis ladata tämän ja isännöi sitä uudelleen omassa palvelimessasi (paikallisesti tai muuten), jos haluat pelata, jos haluat kaivaa koodiin.
Sinulla on mahdollisuus vetämällä kaikki yksittäiset CSS-tiedostot tai kaikkien tyylitaulukoiden jäsentäminen yhdellä verkkotunnuksella. Voit oppia tämän työkalun opiskelusta niin paljon, ja se tarjoaa syvällisemmän käsityksen kehittäjille, jotka joutuvat askelmaisiin yksityiskohtiin.
Jos haluat testata itseäsi, käy vain CSS Statsissa ja liitä verkkosivusto. Tulet hämmästymään siitä, kuinka paljon tietoja on saatavilla ja kuinka paljon voit oppia tällaisesta yksinkertaistetusta työkalusta.