# 028: Isticanje sintakse koda, 2. dio - CSS-trikovi

Anonim

Upravo smo instalirali Prism.js i pokrenuli ga.

U ovom screencast-u pronalazimo temu koja se zove Sutra tema i njezine boje ugrađujemo u isticanje sintakse. Na vrhu datoteke napravimo mali ključ u boji za brzu referencu. Također nagađamo što je što, barem za početak. Ono što na kraju završimo, u boji, u redu je, ali nije spektakularno. Ako danas pregledavate web mjesto, primijetit ćete da je tema u boji više nalik Sumraku, koji sam nekad voljela u TextMateu, a trenutno ga volim u Sublime Text 2.

Završavamo dodavanjem zaglavlja u isječke koda. Nemamo stvarne oznake (ovo je vjerojatno dobro, uglavnom je samo uređivač), dodajemo ih pomoću pseudo elementa i generiranog sadržaja putem relatributa na kodu. Većina postojećeg koda na CSS-trikovima ima ovaj atribut. Ako se ne dogodi, nije velika stvar. Ovdje se zapravo ne koristimo relna ispravan način, ali nisam pretjerano zabrinut zbog toga.

pre(rel):before ( content: attr(rel); )

Nailazimo na mali problem s izradom tog pseudo elementa 100% širine s oblogom. Ispostavilo se da naša izjava o veličini okvira na selektoru * ne utječe na pseudo elemente (nekako ima smisla), pa ažuriramo našu Normalize tako da to uključuje.