Ce este SASS?
SASS este un stil de limbaj care a fost conceput de Hampton Catlin. Este o prescurtare a foilor de stil Syntactically Awesome. Este un limbaj de script preprocesor care poate fi interpretat sau compilat în foi de stil Cascading. Este o versiune mai stabilă și mai puternică a CSS care descrie stilul oricărui document structural. SASS este o simplă extensie la CSS. Include funcții noi, cum ar fi variabile, reguli cuibărite, mixinuri, importuri inline, încorporate în funcții care ajută la manipularea culorii și a altor valori. Toate acestea sunt complet compatibile cu CSS.
Definiție
Este un pre-procesor CSS care ajută la reducerea repetării cu CSS și, la rândul său, economisește timp. Este considerat a fi mai stabil și mai puternic în comparație cu CSS. Acesta descrie stilul unui document foarte clar și structural. Ajută la realizarea lucrărilor într-un mod mai rapid și mai bun. Cu toate caracteristicile sale, este preferat în cea mai mare parte față de CSS. Permite definirea variabilelor care pot începe cu un semn $. Alocarea variabilă se poate face folosind două puncte. De asemenea, acceptă cuibărirea logică pe care CSS nu o are. SASS permite utilizatorului să aibă un cod cuibărit care poate fi inserat unul în celălalt.
Înțelegerea SASS
SASS este considerat puternic, stabil și rapid. Motivul pentru aceasta este faptul că are caracteristici diferențiante precum variabile, cuibărituri, mixine etc. Să trecem prin acestea printr-una singură și să înțelegem mai bine SASS.
1. Variabile:
Variabilele permit utilizatorului să definească anumite valori și să le utilizeze din nou peste cod. Aceste variabile sunt similare cu JavaScript. Orice variabilă poate fi ușor definită adăugând un semn $.
Exemplu : $ variabilă nume: variabilă-valoare;
Un utilizator poate defini orice număr de variabile după cum este necesar. După compilarea variabilelor, acestea sunt înlocuite cu valorile lor reale în CSS.
2. Cuibărit:
Cuibăritul ajută la definirea selectorilor din interiorul selectorilor părinți. CSS nu acceptă acest lucru și, prin urmare, face SASS un limbaj de codificare mai optimizat. Ajută la scrierea codului mai curat și mai puțin repetitiv.
3. Mixine:
Mixina este o altă caracteristică utilă care poate reduce redundanța și face posibilă reutilizarea codului. Este similar cu funcțiile în care un cod odată definit poate fi reutilizat de nenumărate ori.
4. Parțiale și importuri:
Parțialele sunt fișiere separate care pot conține cod care face codul modular. Utilizând această caracteristică puteți avea cu ușurință fișiere separate pentru diferite componente. Un nume parțial este întotdeauna definit prin adăugarea unei sublinieri înainte de nume.
Cum funcționează SASS?
Pentru a obține codul, trebuie să folosiți pre-procesorul SASS. Ajută la traducerea codului SASS în CSS. Acest proces este cunoscut sub numele de transpiring. Este similar cu compilarea, dar aici, în loc de a converti codul relatabil uman în cod automat, traducerea se face dintr-un limbaj care poate fi citit de om în altul. Transmiterea de la SASS la CSS este ușoară. Toate variabilele definite în SASS sunt înlocuite cu valori în CSS. Acest lucru face ușor să creezi și să întreții diferite fișiere CSS pentru aplicația ta.
Cum se utilizează SASS?
Pașii de mai jos vă vor ghida în utilizarea SASS în cel mai simplu mod posibil.
- Creați un dosar demo oriunde pe sistemul dvs.
- În acest folder creați două foldere / CSS și / scss.
- Odată create aceste două foldere, mergeți la / scss folder și creați un fișier numit demo.scss Această extensie este scss ceea ce înseamnă că este un fișier SASS.
- Accesați promptul de comandă și navigați la folderul demo.
- Odată ce vă aflați în acest folder, veți urmări fișierele dvs. scss compilate în CSS. Tastați comanda de mai jos pentru a urmări:
Sass –watch scss: CSS
Ceasul este un steag care detectează schimbarea și compilează fișierul scss în fișierul CSS final, care poate fi utilizat în aplicația dvs.
Avantajele SASS
- SASS permite utilizatorului să scrie un cod curat. Îi facilitează manevrarea și este utilizat mai puțin CSS pentru construirea unui program.
- Conține mai puțin cod, ceea ce face mai ușor să aibă mai rapid CSS-ul corespunzător.
- Este mai stabil, mai puternic și mai elegant. Este folosit de designeri și dezvoltatori și îi ajută să lucreze mai eficient și mai rapid.
- Este compatibil cu CSS și, prin urmare, pot fi utilizate toate bibliotecile CSS.
- Oferă facilități precum cuibăritul, care ajută la scrierea sintaxei cuibărită și folosește funcții precum manipularea culorilor, funcții matematice și alte valori.
De ce ar trebui să folosim SASS?
Mai jos sunt cele cinci puncte majore de ce ar trebui să utilizați SASS:
- Variabile: Spre deosebire de CSS, unde trebuie întotdeauna să te întorci și să verifici stilurile anterioare, SASS are variabile care stochează informații și pot fi refolosite. Toate valorile culorii, stiva de fonturi etc. pot fi stocate și utilizate ori de câte ori este nevoie.
- @import: CSS are @import care atrage toate celelalte stiluri, dar nu creează o altă solicitare HTTP. SASS este un pre-procesor care va trage toate fișierele înainte de a compila CSS. Drept urmare, pagina CSS este gestionată printr-o solicitare HTTP. Cererea poate fi defalcată în bucăți și va servi în continuare doar o pagină browserului.
- Funcții de culoare: SASS are funcții diferite, care sunt similare cu CSS. Toate acestea pot fi utilizate cu ușurință în SASS.
- @extend: @extend ne permite să partajăm un set de proprietăți CSS de la un selector la altul.
- Mixine: Mixinurile sunt declarații care pot fi utilizate pe întregul site.
De ce avem nevoie de SASS?
SASS este mai rapid și mai eficient. Codul SASS poate fi reutilizat și, prin urmare, economisește timp. Conversia codului de la SASS la CSS nu este agitată și, prin urmare, este recomandabil să fie utilizat pentru a putea fi economisit timp.
Public adecvat pentru învățarea tehnologiilor SASS
Orice programator care utilizează CSS și caută o tehnologie mai eficientă și care consumă mai puțin timp pentru construirea aplicațiilor web poate utiliza SASS și experimenta noile funcții.
Cum te ajută această tehnologie să crești în cariera ta?
Este o versiune avansată de CSS. După ce știți SASS, puteți obține cu ușurință freelanceri și locuri de muncă cu companii mari. Vă ajută să lucrați mai rapid și să vă arătați abilitățile cu funcțiile pe care le oferă.
Concluzie
SASS este un mod foarte eficient de înlocuire a CSS. Cu variabilele, cuibarea, mixina și alte caracteristici, ajută la furnizarea de rezultate mai bune decât CSS. Când înlocuiți CSS cu SASS, puteți reutiliza cu ușurință codul dvs. în loc să scrieți aceeași piesă din nou și din nou. Prin urmare, utilizați SASS și deveniți obosiți cu aplicațiile dvs.
Articol recomandat
Acesta a fost un Ghid pentru Ce este SASS? Aici am discutat despre concepte, definiție, lucru, avantaje și creșterea carierei SASS. Puteți parcurge și alte articole sugerate pentru a afla mai multe -
- Ce este Bootstrap și cum se utilizează?
- Ce este VMware? Care este utilizarea sa?
- Ce face un server de aplicații?
- Ce este moștenirea Java?
- Principalele avantaje și dezavantaje ale SAS