| Sass | |
|---|---|
| Tyyppi | Kääntäminen malliprosessori |
| Kehittäjä | Nathan Weizenbaum , Chris Eppstein , Hampton Catlin |
| Käyttöjärjestelmä | Cross-platform |
| Ensimmäinen painos | 28. marraskuuta 2006 |
| uusin versio | Dart Sass: 1.53.0 ( 22. kesäkuuta 2022 ) [1] |
| Lisenssi | MIT-lisenssi |
| Verkkosivusto | sass-lang.com |
Sass ( Syntactically Awesome Stylesheets) on Hamlin mukana tuleva moduuli . Sass on CSS - pohjainen metakieli , joka on suunniteltu lisäämään CSS-koodin abstraktiotasoa ja yksinkertaistamaan peräkkäisiä tyylisivutiedostoja .
Sass-kielellä on kaksi syntaksia:
Yksi Sassin tärkeimmistä ominaisuuksista on sisäkkäiset säännöt, jotka helpottavat sisäkkäisten valitsimien luomista ja muokkaamista.
# otsikon tausta : # FFFFFF . virheen väri : # FF0000 a text-decoration : ei mitään & : hover text-decoration : alleviivaaLähetetään:
# header { background : #FFFFFF ; } #otsikko . _ virhe { väri : #FF0000 ; } # header a { text-decoration : none ; } # header a : hover { text-decoration : underline ; }Sass lisää vakioita ja mixinejä CSS :ään . Tämä helpottaa tietojen eheyden ylläpitämistä useissa tyyleissä. Vakioiden avulla voit asettaa arvon ja käyttää sitä tyylien sisällä, mikseillä voit tehdä saman tyylimääritteen lohkolla.
$ linkkiväri : # 00F väri : $ linkColor _Lähetetään:
a { väri : #00F ; }Esimerkki epäpuhtauksien käytöstä, toimintojen samankaltaisuudesta:
@mixin border-radius ( $säde , $border , $color ) { -webkit-border-radius : $radius ; -moz-border-radius : $säde ; -ms-border-radius : $säde ; raja-säde : $säde ; border : $border solid $color } .box { @ include border-radius ( 10px , 1px , red ); }Lähetetään:
. box { -webkit -border-radius : 10 px ; -moz- rajan säde : 10 px ; -ms- rajan säde : 10 px ; reunus - säde : 10 kuvapistettä reunus : 1 px kiinteä punainen ; }| Tyylisivujen kielet ( vertaa , luettelo ) | |
|---|---|
| Tilat |
|
| Vakio | |
| ei-standardi |
|