Gramofonska igla je predprocesor koda CSS, što nam omogućuje jednostavniji rad u našem uređivaču teksta, a zatim objašnjavam razloge svoje izjave.
Ovo je opis stila kakav poznajemo:
body {font: 12px Helvetica, Arial, sans-serif; } a.button {-webkit-border-radius: 5px; -moz-radijus-granice: 5px; radijus obruba: 5 piksela; }
I ovo bi bio isti stil s kojim je stvoren Olovka:
font fonta 12px Helvetica, Arial, sans-serif a.button -webkit-border-radius 5px -moz-border-radius 5px border-radius 5px
Gdje su ključevi? Gdje su točka i zarez, dvotočka? Zaboravljeni, Gramofonska igla čini to za nas.
Ako započinješ s CSS y HTML nije preporučljivo koristiti Gramofonska igla zbog jednostavne činjenice da možete zaboraviti kako stvari stvarno rade, ali ako već imate vremena na ovom svijetu i želite uštedjeti svoj kod i raditi .. samo naprijed.
Programeri Piton naći će u Gramofonska igla nešto vrlo slično onome čemu su prilagođeni, jer samo trebate ispravno uvući čaroliju.
Instalacija
Za što Gramofonska igla posao koji moramo instalirati Node.js koja je u ogranku Zajednice, pa nastavljamo:
$ sudo pacman -S nodejs
A kasnije instaliramo Stylus. Tradicionalni način bio bi:
$ npm install -g stylus
Dobro se instalira, ali kod mene ne radi, pa je puno lakše instalirati s AUR-a:
$ yaourt -S nodejs-stylus
Kako koristiti Stylus
Ok, već smo instalirali Node.js i mi smo instalirali Gramofonska igla.. Kako ga koristimo? Jednostavno je. Recimo da imamo direktorij sa sljedećim datotekama:
- dir - index.html - style.css
Ono što moramo učiniti je stvoriti datoteku stil.stila, na kojem ćemo raditi. U toj datoteci možemo imati nešto poput:
body background-color #ffff font font size 12px a.button boja crvena podloga 10px
Ako spremimo ili napravimo bilo kakve promjene, ništa se neće dogoditi, jer ne "sastavljamo" svoju datoteku. Da bismo ga sastavili, ono što radimo je da otvorimo terminal u našem direktoriju (gdje je datoteka stil.stila) i izvršiti:
stylus -c style.styl
Ali svaki put kad spremimo datoteku stil.stila morali bismo izvršiti kôd, ali srećom to nije potrebno, jer ako izvršimo istu naredbu, ali dodavanjem parametra -w (gledati) događa se sljedeće:
olovka -c -w style.styl gledanje /usr/lib/node_modules/stylus/lib/functions/index.styl kompilirani style.css promatranje style.styl kompajlirani style.css sastavljeni style.css
Drugim riječima, datoteka se automatski sastavlja .. Bi li rezultat bio?
tijelo {background-color: #fff; font-size: 12px} a.button {color: # f00; padding: 10px}
Kao što vidite, ne samo da nas stvara naš kod CSS, ali eliminira nepotrebne prostore tako da naš list stilova teži manje
Ne samo to, Gramofonska igla Omogućuje nam prosljeđivanje CSS datoteka u njihov format, a način na koji možemo koristiti njihovu sintaksu vrlo je raznolik. A ovo je samo pregled. Stoga vas potičem ako ste zainteresirani da saznate malo više o tome Gramofonska igla