Mi a SASS?
A SASS a stíluslap nyelv, amelyet Hampton Catlin fejlesztett ki. Ez a szintaktikailag félelmetes stíluslapok rövidítése. Ez egy processzor előtti szkriptnyelv, amely értelmezhető vagy összeállítható Cascading stíluslapokká. Ez a CSS stabilabb és hatékonyabb változata, amely szerkezetileg leírja a dokumentumok stílusát. A SASS a CSS puszta kiterjesztése. Új funkciókat tartalmaz, például változók, beágyazott szabályok, keverékek, inline importálás, beépített funkciók, amelyek elősegítik a szín és más értékek kezelését. Mindez teljesen kompatibilis a CSS-sel.
Meghatározás
Ez egy CSS előfeldolgozó, amely elősegíti az ismétlés csökkentését a CSS segítségével, és ezzel időt takarít meg. A CSS-hez képest stabilabbnak és erősebbnek tekintik. Nagyon világosan és szerkezetileg írja le a dokumentum stílusát. Ez elősegíti a munka gyorsabb és jobb elvégzését. Minden tulajdonságával elsősorban a CSS-hez képest. Ez lehetővé teszi olyan változók meghatározását, amelyek egy $ jellel kezdődhetnek. A változó hozzárendelése kettőspont használatával végezhető el. Támogatja a logikai beágyazást is, amelyet a CSS nem. A SASS lehetővé teszi a felhasználó számára, hogy egymásba beilleszthető beágyazott kódot tartalmazzon.
A SASS megértése
A SASS nagy teljesítményűnek, stabilnak és gyorsnak tekinthető. Ennek oka az, hogy megkülönböztető tulajdonságai vannak, mint a változók, a fészkelés, a keverékek, stb. Vizsgáljuk át ezeket egyenként, és jobban megértsük a SASS-ot.
1. Változók:
A változók lehetővé teszik a felhasználó számára, hogy meghatározott értékeket definiáljon és újra felhasználhassa azokat a kódban. Ezek a változók hasonlóak a JavaScript-hez. Bármely változó könnyen meghatározható egy $ jel hozzáadásával.
Példa : $ változónév: változóérték;
A felhasználó tetszőleges számú változót definiálhat szükség szerint. A változók összeállítása után azokat helyettesítik a CSS-ben szereplő tényleges értékeikkel.
2. Fészekrakás:
A fészek segít a gyermekválasztók meghatározásában a szülőválasztókban. A CSS ezt nem támogatja, ezért a SASS optimalizálta a kódolási nyelvet. Segít a tisztább és kevésbé ismétlődő kód megírásában.
3. Keverékek:
A Mixin egy másik hasznos szolgáltatás, amely csökkentheti a redundanciát, és lehetővé teszi a kód újrafelhasználását. Hasonló a funkciókhoz, ahol egy egyszer definiált kód tetszőleges számú alkalommal újra felhasználható.
4. Részek és importok:
A partíciók külön fájlok, amelyek kódot tartalmazhatnak, ami modulárissá teszi a kódot. Ezzel a funkcióval könnyen külön fájlokat hozhat létre a különféle összetevők számára. A partíciós nevet mindig úgy definiáljuk, hogy a név elé húzzunk egy aláhúzást.
Hogyan működik a SASS?
A kód megszerzéséhez a SASS előfeldolgozót kell használnia. Segít az SASS kód CSS-re történő fordításában. Ezt a folyamatot transzpirálónak nevezik. Ez hasonló a fordításhoz, de itt ahelyett, hogy az emberi relatable kódot gépi kódra konvertálnánk, a fordítást az egyik ember által olvasható nyelvről a másikra hajtjuk végre. A SASS-ról a CSS-re történő áttérés egyszerű. Az SASS-ban meghatározott összes változó helyébe a CSS értékei lépnek. Ez megkönnyíti a különféle CSS-fájlok létrehozását és karbantartását az alkalmazás számára.
Hogyan kell használni a SASS-t?
Az alábbiakban bemutatjuk, hogyan kell a SASS-ot a lehető legegyszerűbben használni.
- Hozzon létre egy bemutató mappát a rendszer bárhol.
- Ezen a mappán belül hozzon létre két mappát / CSS és / scss.
- A két mappa létrehozása után lépjen a / scss mappába, és hozzon létre egy demo.scss nevû fájlt. Ez a kiterjesztés scss, ami azt jelenti, hogy egy SASS fájl.
- Ugrás a parancssorba, és keresse meg a bemutató mappát.
- Miután belépsz ebbe a mappába, megnézed az SCS fájljainak CSS-re való fordítását. Írja be az alábbi parancsot a megtekintéshez:
Sass-watch scss: CSS
Az óra egy olyan zászló, amely észleli a változást, és az scss fájlt összeállítja a végső CSS fájlba, amelyet felhasználhat az alkalmazásában.
A SASS előnyei
- A SASS lehetővé teszi a felhasználó számára, hogy tiszta kódot írjon. Ez megkönnyíti a kezelést, és kevesebb CSS-t használ fel egy program felépítéséhez.
- Kevesebb kódot tartalmaz, ami megkönnyíti a megfelelő CSS gyorsabb elérését.
- Ez stabilabb, erősebb és elegánsabb. A tervezők és fejlesztők használják, és segít nekik a hatékonyabb és gyorsabb munkában.
- Kompatibilis a CSS-sel, így minden CSS könyvtár felhasználható.
- Olyan szolgáltatásokat nyújt, mint a fészkelés, amely elősegíti a beágyazott szintaxis megírását, és olyan funkciók felhasználását használja, mint a színkezelés, a matematikai függvények és egyéb értékek.
Miért kellene használni a SASS-t?
Az alábbiakban bemutatjuk az öt fő pontot, amelyek miatt érdemes használni a SASS-ot:
- Változók: Ellentétben a CSS-sel, ahol mindig vissza kell mennie és meg kell vizsgálnia a korábbi stílusokat, az SASS olyan változókkal rendelkezik, amelyek információkat tárolnak és újra felhasználhatók. Minden színérték, betűkészlet-verem stb. Tárolható és felhasználható, amikor csak szükséges.
- @import: A CSS-nek van @import, amely minden más stílust lekér, de nem hoz létre újabb HTTP-kérést. A SASS egy olyan előfeldolgozó, amely minden fájlt lehív, mielőtt összeállítja a CSS-t. Ennek eredményeként a CSS oldalt egy HTTP kérés kezeli. A kérés darabokra bontható, és továbbra is csak egy oldalt szolgál a böngésző számára.
- Színfunkciók : A SASS-nak különféle funkciói vannak, amelyek hasonlóak a CSS-hez. Mindez könnyen használható a SASS-ban.
- @extend: A @extend lehetővé teszi számunkra, hogy megosszuk a CSS tulajdonságok sorozatát az egyik választóról a másikra.
- Mixins: A mixins olyan deklarációk, amelyeket az oldalon mindenhol lehet használni.
Miért van szükség SASS-ra?
A SASS gyorsabb és hatékonyabb. A SASS kód újra felhasználható, így időt takarít meg. A kód SASS-ról CSS-re történő átalakítása nem hamis, ezért tanácsos azt használni, hogy időt takarítson meg.
Megfelelő közönség az SASS technológiák tanulásához
Bármelyik programozó, aki CSS-t használ, és hatékonyabb és kevésbé időigényes technológiát keres a webes alkalmazások készítéséhez, használhatja a SASS-ot és megtapasztalhatja az új funkciókat.
Hogyan segít ez a technológia a karrierjének növekedésében?
Ez a CSS fejlett verziója. Miután megismerte a SASS-ot, könnyen kaphat szabadúszót és munkahelyeket nagyvállalatoknál. Segít abban, hogy gyorsabban dolgozzon, és mutassa meg képességeit az általa nyújtott szolgáltatásokkal.
Következtetés
A SASS a CSS helyettesítésének nagyon hatékony módja. A változókat, a fészkelést, a mixint és más funkciókat használva jobb eredményeket nyújt, mint a CSS. Ha a CSS-t SASS-ra cseréli, akkor könnyen újra felhasználhatja a kódját, ahelyett, hogy ugyanazt a darabot újra és újra megírná. Ezért használja a SASS-ot, és légy nyugtalan az alkalmazásaival.
Ajánlott cikk
Ez egy útmutató a Mi az SASS? Itt megvitattuk a SASS fogalmait, meghatározását, működését, előnyeit és karrier-növekedését. A további javasolt cikkeken keresztül további információkat is megtudhat -
- Mi a Bootstrap és hogyan kell használni?
- Mi a VMware? Mi a felhasználása?
- Mit csinál egy Application Server?
- Mi a Java öröklés?
- A SAS legfontosabb előnyei és hátrányai