Ha jól emlékszem, a Google Code Prettify programmal alkalmaztam a szintaxis kiemelését a CSS-Tricks kódblokkján. Tudja, hogy a hasonló vonalban test
a
rész más színű, mint a test
rész. Ez nagyon hasznos a kód olvashatóságához. Ez is segít az olvasóknak abban, hogy azonnal megértsék, mit néznek, egy kódblokk (az emberek szeretnek cikkeket beolvasni, nem tudod).
Ebben az új dizájnban úgy döntünk, hogy inkább a frissen kiadott Prism.js-t választjuk. Ez egy kicsit könnyebb és gyorsabb. Azt is testre szabta, hogy csak HTML, CSS és JavaScript használatával működjön, ami a CSS-Tricks kódjának 95% -a. Nekem is nagyon tetszik, hogy a színezéshez használt osztályneveket racionálisan nevezik meg.
Kezdjük kitalálni, hogyan kell pontosan használni. Először is azt mondjuk a CodeKit-nek, hogy összefűzze ezt a könyvtárat a globális JavaScript fájlunkba (amely egyelőre üres, de később oda írunk kódot). Összekapcsoljuk a tömörített JavaScript fájlt a mellékelt lábléc részben.
Egy percbe telik megérteni, hogy nincs semmi, amit „hívsz”, ez csak úgy működik, ha feltételezzük, hogy a helyes osztálynevek vannak a helyén. Úgy fejezzük be, hogy kicsit eljátszunk a CSS-sel, és a kódot jobban kinézzük, mint mindig a CSS-Tricksnél.