Ką tik įdiegėme „Prism.js“ ir pradėjome veikti.
Šioje ekrano kopijoje randame temą, vadinamą „Rytojaus tema“, ir įjungiame jos spalvas į sintaksės paryškinimą. Padarome nedidelį spalvotą klavišą failo viršuje, kad būtų galima greitai sužinoti. Mes taip pat spėjame, kas yra kas, bent jau pradėti. Tai, kuo baigiamės, išmintingai, yra gerai, bet ne įspūdinga. Jei šiandien naršysite po svetainę, pastebėsite, kad spalvų tema yra labiau panaši į „Prieblandą“, kurią mėgau „TextMate“, o šiuo metu myliu „Sublime Text 2“.
Pabaigoje pridėsime antraštės juostas prie kodo fragmentų. Mes neturime faktinio žymėjimo tai padaryti (kas tikriausiai yra gerai, dažniausiai tai tik dekoratorius), mes pridedame jį naudodami pseudo elementą ir sugeneruotą turinį per relkodo atributą. Dauguma esamo CSS-Tricks kodo turi šį atributą. Jei ne, tai nėra didelė problema. Mes čia tikrai nenaudojame relteisingai, bet manęs tai per daug nesijaudina.
pre(rel):before ( content: attr(rel); )Mes susidūrėme su maža problema, kai tą pseudo elementą padarykite 100% pločio su paminkštinimu. Pasirodo, kad langelio dydžio deklaracija * selektoriuje neturi įtakos pseudo elementams (tam tikra prasmė), todėl mes atnaujiname „Normalize“, kad tai įtrauktume.
