# 028: koodi süntaksi esiletõstmine, 2. osa - CSS-trikid

Anonim

Oleme just installinud Prism.js ja töötanud.

Selles ekraanivaates leiame teema nimega Tomorrow Theme ja ingrateerime selle värvid süntaksi esiletõstmiseks. Kiireks tutvumiseks valmistame faili ülaossa väikese värviklahvi. Vähemalt alustamiseks teeme ka mõned oletused, mis on mis. See, milleni me värvitargalt jõuame, on korras, kuid mitte tähelepanuväärne. Kui sirvite saidil täna ringi, märkate, et värviteema sarnaneb pigem Videvikuga, mida ma varem armastasin TextMate'is ja armastan praegu Sublime Text 2.

Lõpetuseks lisame koodijuppidesse päiseribad. Meil pole seda teha (see on ilmselt hea, see on enamasti lihtsalt dekoraator). Lisame selle pseudoelemendi abil ja genereerisime relkoodi atribuudi kaudu . Enamikul CSS-Tricksis olemasolevatest koodidest on see atribuut. Kui ei, siis pole suurem asi. Me ei kasuta siin tegelikult relõiget viisi, kuid ma pole selle pärast üleliia mures.

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

Selle pseudoelemendi polsterdusega 100% laiuse tegemisel tekib väike probleem. Selgub, et meie valija * kastikoha suurus ei mõjuta pseudoelemente (teatud mõttes on mõistlik), nii et värskendame oma Normalize'i selle lisamiseks.