CINXE.COM

<!DOCTYPE html> <html class="client-nojs vector-feature-language-in-header-enabled vector-feature-language-in-main-page-header-disabled vector-feature-page-tools-pinned-disabled vector-feature-toc-pinned-clientpref-1 vector-feature-main-menu-pinned-disabled vector-feature-limited-width-clientpref-1 vector-feature-limited-width-content-enabled vector-feature-custom-font-size-clientpref-1 vector-feature-appearance-pinned-clientpref-1 vector-feature-night-mode-enabled skin-theme-clientpref-day vector-sticky-header-enabled vector-toc-available" lang="it" dir="ltr"> <head> <meta charset="UTF-8"> <title>Sass - Wikipedia</title> <script>(function(){var className="client-js vector-feature-language-in-header-enabled vector-feature-language-in-main-page-header-disabled vector-feature-page-tools-pinned-disabled vector-feature-toc-pinned-clientpref-1 vector-feature-main-menu-pinned-disabled vector-feature-limited-width-clientpref-1 vector-feature-limited-width-content-enabled vector-feature-custom-font-size-clientpref-1 vector-feature-appearance-pinned-clientpref-1 vector-feature-night-mode-enabled skin-theme-clientpref-day vector-sticky-header-enabled vector-toc-available";var cookie=document.cookie.match(/(?:^|; )itwikimwclientpreferences=([^;]+)/);if(cookie){cookie[1].split('%2C').forEach(function(pref){className=className.replace(new RegExp('(^| )'+pref.replace(/-clientpref-\w+$|[^\w-]+/g,'')+'-clientpref-\\w+( |$)'),'$1'+pref+'$2');});}document.documentElement.className=className;}());RLCONF={"wgBreakFrames":false,"wgSeparatorTransformTable":[",\t."," \t,"],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","gennaio","febbraio","marzo","aprile","maggio","giugno","luglio","agosto","settembre","ottobre","novembre","dicembre"],"wgRequestId":"4ee1e26b-2276-491e-8ffe-66849f1aec9c","wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"Sass","wgTitle":"Sass","wgCurRevisionId":140111369,"wgRevisionId":140111369,"wgArticleId":4715289,"wgIsArticle":true,"wgIsRedirect":false,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":["Template Webarchive - collegamenti all'Internet Archive","P856 letta da Wikidata","P2037 letta da Wikidata","CSS","Linguaggi per fogli di stile","Standard W3C","Standard Internet"],"wgPageViewLanguage":"it","wgPageContentLanguage":"it","wgPageContentModel":"wikitext","wgRelevantPageName":"Sass","wgRelevantArticleId":4715289,"wgIsProbablyEditable":true,"wgRelevantPageIsProbablyEditable":true,"wgRestrictionEdit":[],"wgRestrictionMove":[],"wgNoticeProject":"wikipedia","wgCiteReferencePreviewsActive":false,"wgMediaViewerOnClick":true,"wgMediaViewerEnabledByDefault":true,"wgPopupsFlags":0,"wgVisualEditor":{"pageLanguageCode":"it","pageLanguageDir":"ltr","pageVariantFallbacks":"it"},"wgMFDisplayWikibaseDescriptions":{"search":true,"watchlist":true,"tagline":true,"nearby":true},"wgWMESchemaEditAttemptStepOversample":false,"wgWMEPageLength":20000,"wgEditSubmitButtonLabelPublish":true,"wgULSPosition":"interlanguage","wgULSisCompactLinksEnabled":false,"wgVector2022LanguageInHeader":true,"wgULSisLanguageSelectorEmpty":false,"wgWikibaseItemId":"Q1572865","wgCheckUserClientHintsHeadersJsApi":["brands","architecture","bitness","fullVersionList","mobile","model","platform","platformVersion"],"GEHomepageSuggestedEditsEnableTopics":true,"wgGETopicsMatchModeEnabled":false,"wgGELevelingUpEnabledForUser":false}; RLSTATE={"ext.globalCssJs.user.styles":"ready","site.styles":"ready","user.styles":"ready","ext.globalCssJs.user":"ready","user":"ready","user.options":"loading","ext.cite.styles":"ready","skins.vector.search.codex.styles":"ready","skins.vector.styles":"ready","skins.vector.icons":"ready","jquery.makeCollapsible.styles":"ready","ext.wikimediamessages.styles":"ready","ext.visualEditor.desktopArticleTarget.noscript":"ready","ext.uls.interlanguage":"ready","wikibase.client.init":"ready"};RLPAGEMODULES=["ext.cite.ux-enhancements","site","mediawiki.page.ready","jquery.makeCollapsible","mediawiki.toc","skins.vector.js","ext.centralNotice.geoIP","ext.centralNotice.startUp","ext.gadget.MainPageWikiList","ext.gadget.stru-commonsupload","ext.gadget.HiddenCat","ext.gadget.ReferenceTooltips","ext.gadget.TitoloErrato","ext.gadget.NewSection","ext.gadget.RichiediRevisioneBozza","ext.urlShortener.toolbar","ext.centralauth.centralautologin","mmv.bootstrap","ext.popups","ext.visualEditor.desktopArticleTarget.init","ext.visualEditor.targetLoader","ext.echo.centralauth","ext.eventLogging","ext.wikimediaEvents","ext.navigationTiming","ext.uls.interface","ext.cx.eventlogging.campaigns","ext.cx.uls.quick.actions","wikibase.client.vector-2022","ext.checkUser.clientHints","ext.growthExperiments.SuggestedEditSession"];</script> <script>(RLQ=window.RLQ||[]).push(function(){mw.loader.impl(function(){return["user.options@12s5i",function($,jQuery,require,module){mw.user.tokens.set({"patrolToken":"+\\","watchToken":"+\\","csrfToken":"+\\"}); }];});});</script> <link rel="stylesheet" href="/w/load.php?lang=it&modules=ext.cite.styles%7Cext.uls.interlanguage%7Cext.visualEditor.desktopArticleTarget.noscript%7Cext.wikimediamessages.styles%7Cjquery.makeCollapsible.styles%7Cskins.vector.icons%2Cstyles%7Cskins.vector.search.codex.styles%7Cwikibase.client.init&only=styles&skin=vector-2022"> <script async="" src="/w/load.php?lang=it&modules=startup&only=scripts&raw=1&skin=vector-2022"></script> <meta name="ResourceLoaderDynamicStyles" content=""> <link rel="stylesheet" href="/w/load.php?lang=it&modules=site.styles&only=styles&skin=vector-2022"> <meta name="generator" content="MediaWiki 1.44.0-wmf.24"> <meta name="referrer" content="origin"> <meta name="referrer" content="origin-when-cross-origin"> <meta name="robots" content="max-image-preview:standard"> <meta name="format-detection" content="telephone=no"> <meta name="viewport" content="width=1120"> <meta property="og:title" content="Sass - Wikipedia"> <meta property="og:type" content="website"> <link rel="preconnect" href="//upload.wikimedia.org"> <link rel="alternate" media="only screen and (max-width: 640px)" href="//it.m.wikipedia.org/wiki/Sass"> <link rel="alternate" type="application/x-wiki" title="Modifica" href="/w/index.php?title=Sass&action=edit"> <link rel="apple-touch-icon" href="/static/apple-touch/wikipedia.png"> <link rel="icon" href="/static/favicon/wikipedia.ico"> <link rel="search" type="application/opensearchdescription+xml" href="/w/rest.php/v1/search" title="Wikipedia (it)"> <link rel="EditURI" type="application/rsd+xml" href="//it.wikipedia.org/w/api.php?action=rsd"> <link rel="canonical" href="https://it.wikipedia.org/wiki/Sass"> <link rel="license" href="https://creativecommons.org/licenses/by-sa/4.0/deed.it"> <link rel="alternate" type="application/atom+xml" title="Feed Atom di Wikipedia" href="/w/index.php?title=Speciale:UltimeModifiche&feed=atom"> <link rel="dns-prefetch" href="//meta.wikimedia.org" /> <link rel="dns-prefetch" href="auth.wikimedia.org"> </head> <body class="skin--responsive skin-vector skin-vector-search-vue mediawiki ltr sitedir-ltr mw-hide-empty-elt ns-0 ns-subject mw-editable page-Sass rootpage-Sass skin-vector-2022 action-view"><a class="mw-jump-link" href="#bodyContent">Vai al contenuto</a> <div class="vector-header-container"> <header class="vector-header mw-header"> <div class="vector-header-start"> <nav class="vector-main-menu-landmark" aria-label="Sito"> <div id="vector-main-menu-dropdown" class="vector-dropdown vector-main-menu-dropdown vector-button-flush-left vector-button-flush-right" title="Menu principale" > <input type="checkbox" id="vector-main-menu-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-main-menu-dropdown" class="vector-dropdown-checkbox " aria-label="Menu principale" > <label id="vector-main-menu-dropdown-label" for="vector-main-menu-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only " aria-hidden="true" ><span class="vector-icon mw-ui-icon-menu mw-ui-icon-wikimedia-menu"></span> <span class="vector-dropdown-label-text">Menu principale</span> </label> <div class="vector-dropdown-content"> <div id="vector-main-menu-unpinned-container" class="vector-unpinned-container"> <div id="vector-main-menu" class="vector-main-menu vector-pinnable-element"> <div class="vector-pinnable-header vector-main-menu-pinnable-header vector-pinnable-header-unpinned" data-feature-name="main-menu-pinned" data-pinnable-element-id="vector-main-menu" data-pinned-container-id="vector-main-menu-pinned-container" data-unpinned-container-id="vector-main-menu-unpinned-container" > <div class="vector-pinnable-header-label">Menu principale</div> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-pin-button" data-event-name="pinnable-header.vector-main-menu.pin">sposta nella barra laterale</button> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button" data-event-name="pinnable-header.vector-main-menu.unpin">nascondi</button> </div> <div id="p-navigation" class="vector-menu mw-portlet mw-portlet-navigation" > <div class="vector-menu-heading"> Navigazione </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="n-mainpage-description" class="mw-list-item"><a href="/wiki/Pagina_principale" title="Visita la pagina principale [z]" accesskey="z"><span>Pagina principale</span></a></li><li id="n-recentchanges" class="mw-list-item"><a href="/wiki/Speciale:UltimeModifiche" title="Elenco delle ultime modifiche del sito [r]" accesskey="r"><span>Ultime modifiche</span></a></li><li id="n-randompage" class="mw-list-item"><a href="/wiki/Speciale:PaginaCasuale" title="Mostra una pagina a caso [x]" accesskey="x"><span>Una voce a caso</span></a></li><li id="n-nearby-pages-title" class="mw-list-item"><a href="/wiki/Speciale:NelleVicinanze"><span>Nelle vicinanze</span></a></li><li id="n-vetrina" class="mw-list-item"><a href="/wiki/Wikipedia:Vetrina"><span>Vetrina</span></a></li><li id="n-help" class="mw-list-item"><a href="/wiki/Aiuto:Aiuto" title="Pagine di aiuto"><span>Aiuto</span></a></li><li id="n-Sportello-informazioni" class="mw-list-item"><a href="/wiki/Aiuto:Sportello_informazioni"><span>Sportello informazioni</span></a></li><li id="n-specialpages" class="mw-list-item"><a href="/wiki/Speciale:PagineSpeciali"><span>Pagine speciali</span></a></li> </ul> </div> </div> <div id="p-Comunità" class="vector-menu mw-portlet mw-portlet-Comunità" > <div class="vector-menu-heading"> Comunità </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="n-portal" class="mw-list-item"><a href="/wiki/Portale:Comunit%C3%A0" title="Descrizione del progetto, cosa puoi fare, dove trovare le cose"><span>Portale Comunità</span></a></li><li id="n-villagepump" class="mw-list-item"><a href="/wiki/Wikipedia:Bar"><span>Bar</span></a></li><li id="n-wikipediano" class="mw-list-item"><a href="/wiki/Wikipedia:Wikipediano"><span>Il Wikipediano</span></a></li><li id="n-contactpage" class="mw-list-item"><a href="/wiki/Wikipedia:Contatti"><span>Contatti</span></a></li> </ul> </div> </div> </div> </div> </div> </div> </nav> <a href="/wiki/Pagina_principale" class="mw-logo"> <img class="mw-logo-icon" src="/static/images/icons/wikipedia.png" alt="" aria-hidden="true" height="50" width="50"> <span class="mw-logo-container skin-invert"> <img class="mw-logo-wordmark" alt="Wikipedia" src="/static/images/mobile/copyright/wikipedia-wordmark-en.svg" style="width: 7.5em; height: 1.125em;"> <img class="mw-logo-tagline" alt="L'enciclopedia libera" src="/static/images/mobile/copyright/wikipedia-tagline-it.svg" width="120" height="13" style="width: 7.5em; height: 0.8125em;"> </span> </a> </div> <div class="vector-header-end"> <div id="p-search" role="search" class="vector-search-box-vue vector-search-box-collapses vector-search-box-show-thumbnail vector-search-box-auto-expand-width vector-search-box"> <a href="/wiki/Speciale:Ricerca" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only search-toggle" title="Cerca in Wikipedia [f]" accesskey="f"><span class="vector-icon mw-ui-icon-search mw-ui-icon-wikimedia-search"></span> <span>Ricerca</span> </a> <div class="vector-typeahead-search-container"> <div class="cdx-typeahead-search cdx-typeahead-search--show-thumbnail cdx-typeahead-search--auto-expand-width"> <form action="/w/index.php" id="searchform" class="cdx-search-input cdx-search-input--has-end-button"> <div id="simpleSearch" class="cdx-search-input__input-wrapper" data-search-loc="header-moved"> <div class="cdx-text-input cdx-text-input--has-start-icon"> <input class="cdx-text-input__input" type="search" name="search" placeholder="Cerca in Wikipedia" aria-label="Cerca in Wikipedia" autocapitalize="sentences" title="Cerca in Wikipedia [f]" accesskey="f" id="searchInput" > <span class="cdx-text-input__icon cdx-text-input__start-icon"></span> </div> <input type="hidden" name="title" value="Speciale:Ricerca"> </div> <button class="cdx-button cdx-search-input__end-button">Ricerca</button> </form> </div> </div> </div> <nav class="vector-user-links vector-user-links-wide" aria-label="Strumenti personali"> <div class="vector-user-links-main"> <div id="p-vector-user-menu-preferences" class="vector-menu mw-portlet emptyPortlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> </ul> </div> </div> <div id="p-vector-user-menu-userpage" class="vector-menu mw-portlet emptyPortlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> </ul> </div> </div> <nav class="vector-appearance-landmark" aria-label="Aspetto"> <div id="vector-appearance-dropdown" class="vector-dropdown " title="Modifica la dimensione, la larghezza e il colore del testo" > <input type="checkbox" id="vector-appearance-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-appearance-dropdown" class="vector-dropdown-checkbox " aria-label="Aspetto" > <label id="vector-appearance-dropdown-label" for="vector-appearance-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only " aria-hidden="true" ><span class="vector-icon mw-ui-icon-appearance mw-ui-icon-wikimedia-appearance"></span> <span class="vector-dropdown-label-text">Aspetto</span> </label> <div class="vector-dropdown-content"> <div id="vector-appearance-unpinned-container" class="vector-unpinned-container"> </div> </div> </div> </nav> <div id="p-vector-user-menu-notifications" class="vector-menu mw-portlet emptyPortlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> </ul> </div> </div> <div id="p-vector-user-menu-overflow" class="vector-menu mw-portlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="pt-sitesupport-2" class="user-links-collapsible-item mw-list-item user-links-collapsible-item"><a data-mw="interface" href="https://donate.wikimedia.org/?wmf_source=donate&wmf_medium=sidebar&wmf_campaign=it.wikipedia.org&uselang=it" class=""><span>Fai una donazione</span></a> </li> <li id="pt-createaccount-2" class="user-links-collapsible-item mw-list-item user-links-collapsible-item"><a data-mw="interface" href="/w/index.php?title=Speciale:CreaUtenza&returnto=Sass" title="Si consiglia di registrarsi e di effettuare l'accesso, anche se non è obbligatorio" class=""><span>registrati</span></a> </li> <li id="pt-login-2" class="user-links-collapsible-item mw-list-item user-links-collapsible-item"><a data-mw="interface" href="/w/index.php?title=Speciale:Entra&returnto=Sass" title="Si consiglia di effettuare l'accesso, anche se non è obbligatorio [o]" accesskey="o" class=""><span>entra</span></a> </li> </ul> </div> </div> </div> <div id="vector-user-links-dropdown" class="vector-dropdown vector-user-menu vector-button-flush-right vector-user-menu-logged-out" title="Altre opzioni" > <input type="checkbox" id="vector-user-links-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-user-links-dropdown" class="vector-dropdown-checkbox " aria-label="Strumenti personali" > <label id="vector-user-links-dropdown-label" for="vector-user-links-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only " aria-hidden="true" ><span class="vector-icon mw-ui-icon-ellipsis mw-ui-icon-wikimedia-ellipsis"></span> <span class="vector-dropdown-label-text">Strumenti personali</span> </label> <div class="vector-dropdown-content"> <div id="p-personal" class="vector-menu mw-portlet mw-portlet-personal user-links-collapsible-item" title="Menu utente" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="pt-sitesupport" class="user-links-collapsible-item mw-list-item"><a href="https://donate.wikimedia.org/?wmf_source=donate&wmf_medium=sidebar&wmf_campaign=it.wikipedia.org&uselang=it"><span>Fai una donazione</span></a></li><li id="pt-createaccount" class="user-links-collapsible-item mw-list-item"><a href="/w/index.php?title=Speciale:CreaUtenza&returnto=Sass" title="Si consiglia di registrarsi e di effettuare l'accesso, anche se non è obbligatorio"><span class="vector-icon mw-ui-icon-userAdd mw-ui-icon-wikimedia-userAdd"></span> <span>registrati</span></a></li><li id="pt-login" class="user-links-collapsible-item mw-list-item"><a href="/w/index.php?title=Speciale:Entra&returnto=Sass" title="Si consiglia di effettuare l'accesso, anche se non è obbligatorio [o]" accesskey="o"><span class="vector-icon mw-ui-icon-logIn mw-ui-icon-wikimedia-logIn"></span> <span>entra</span></a></li> </ul> </div> </div> <div id="p-user-menu-anon-editor" class="vector-menu mw-portlet mw-portlet-user-menu-anon-editor" > <div class="vector-menu-heading"> Pagine per utenti anonimi <a href="/wiki/Aiuto:Benvenuto" aria-label="Ulteriori informazioni sulla contribuzione"><span>ulteriori informazioni</span></a> </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="pt-anoncontribs" class="mw-list-item"><a href="/wiki/Speciale:MieiContributi" title="Un elenco delle modifiche fatte da questo indirizzo IP [y]" accesskey="y"><span>contributi</span></a></li><li id="pt-anontalk" class="mw-list-item"><a href="/wiki/Speciale:MieDiscussioni" title="Discussioni sulle modifiche fatte da questo indirizzo IP [n]" accesskey="n"><span>discussioni</span></a></li> </ul> </div> </div> </div> </div> </nav> </div> </header> </div> <div class="mw-page-container"> <div class="mw-page-container-inner"> <div class="vector-sitenotice-container"> <div id="siteNotice"></div> </div> <div class="vector-column-start"> <div class="vector-main-menu-container"> <div id="mw-navigation"> <nav id="mw-panel" class="vector-main-menu-landmark" aria-label="Sito"> <div id="vector-main-menu-pinned-container" class="vector-pinned-container"> </div> </nav> </div> </div> <div class="vector-sticky-pinned-container"> <nav id="mw-panel-toc" aria-label="Indice" data-event-name="ui.sidebar-toc" class="mw-table-of-contents-container vector-toc-landmark"> <div id="vector-toc-pinned-container" class="vector-pinned-container"> <div id="vector-toc" class="vector-toc vector-pinnable-element"> <div class="vector-pinnable-header vector-toc-pinnable-header vector-pinnable-header-pinned" data-feature-name="toc-pinned" data-pinnable-element-id="vector-toc" > <h2 class="vector-pinnable-header-label">Indice</h2> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-pin-button" data-event-name="pinnable-header.vector-toc.pin">sposta nella barra laterale</button> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button" data-event-name="pinnable-header.vector-toc.unpin">nascondi</button> </div> <ul class="vector-toc-contents" id="mw-panel-toc-list"> <li id="toc-mw-content-text" class="vector-toc-list-item vector-toc-level-1"> <a href="#" class="vector-toc-link"> <div class="vector-toc-text">Inizio</div> </a> </li> <li id="toc-Installazione" class="vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded"> <a class="vector-toc-link" href="#Installazione"> <div class="vector-toc-text"> <span class="vector-toc-numb">1</span> <span>Installazione</span> </div> </a> <ul id="toc-Installazione-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Storia" class="vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded"> <a class="vector-toc-link" href="#Storia"> <div class="vector-toc-text"> <span class="vector-toc-numb">2</span> <span>Storia</span> </div> </a> <ul id="toc-Storia-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Principali_implementazioni" class="vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded"> <a class="vector-toc-link" href="#Principali_implementazioni"> <div class="vector-toc-text"> <span class="vector-toc-numb">3</span> <span>Principali implementazioni</span> </div> </a> <ul id="toc-Principali_implementazioni-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Caratteristiche" class="vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded"> <a class="vector-toc-link" href="#Caratteristiche"> <div class="vector-toc-text"> <span class="vector-toc-numb">4</span> <span>Caratteristiche</span> </div> </a> <button aria-controls="toc-Caratteristiche-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> <span class="vector-icon mw-ui-icon-wikimedia-expand"></span> <span>Attiva/disattiva la sottosezione Caratteristiche</span> </button> <ul id="toc-Caratteristiche-sublist" class="vector-toc-list"> <li id="toc-Variabili" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Variabili"> <div class="vector-toc-text"> <span class="vector-toc-numb">4.1</span> <span>Variabili</span> </div> </a> <ul id="toc-Variabili-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Annidamento" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Annidamento"> <div class="vector-toc-text"> <span class="vector-toc-numb">4.2</span> <span>Annidamento</span> </div> </a> <ul id="toc-Annidamento-sublist" class="vector-toc-list"> <li id="toc-Loop" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#Loop"> <div class="vector-toc-text"> <span class="vector-toc-numb">4.2.1</span> <span>Loop</span> </div> </a> <ul id="toc-Loop-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Argomenti" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#Argomenti"> <div class="vector-toc-text"> <span class="vector-toc-numb">4.2.2</span> <span>Argomenti</span> </div> </a> <ul id="toc-Argomenti-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-In_combinazione" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#In_combinazione"> <div class="vector-toc-text"> <span class="vector-toc-numb">4.2.3</span> <span>In combinazione</span> </div> </a> <ul id="toc-In_combinazione-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Eredità_del_selettore" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Eredità_del_selettore"> <div class="vector-toc-text"> <span class="vector-toc-numb">4.3</span> <span>Eredità del selettore</span> </div> </a> <ul id="toc-Eredità_del_selettore-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-libSass" class="vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded"> <a class="vector-toc-link" href="#libSass"> <div class="vector-toc-text"> <span class="vector-toc-numb">5</span> <span>libSass</span> </div> </a> <ul id="toc-libSass-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Integrazione_IDE" class="vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded"> <a class="vector-toc-link" href="#Integrazione_IDE"> <div class="vector-toc-text"> <span class="vector-toc-numb">6</span> <span>Integrazione IDE</span> </div> </a> <ul id="toc-Integrazione_IDE-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Note" class="vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded"> <a class="vector-toc-link" href="#Note"> <div class="vector-toc-text"> <span class="vector-toc-numb">7</span> <span>Note</span> </div> </a> <ul id="toc-Note-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Voci_correlate" class="vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded"> <a class="vector-toc-link" href="#Voci_correlate"> <div class="vector-toc-text"> <span class="vector-toc-numb">8</span> <span>Voci correlate</span> </div> </a> <ul id="toc-Voci_correlate-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Collegamenti_esterni" class="vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded"> <a class="vector-toc-link" href="#Collegamenti_esterni"> <div class="vector-toc-text"> <span class="vector-toc-numb">9</span> <span>Collegamenti esterni</span> </div> </a> <ul id="toc-Collegamenti_esterni-sublist" class="vector-toc-list"> </ul> </li> </ul> </div> </div> </nav> </div> </div> <div class="mw-content-container"> <main id="content" class="mw-body"> <header class="mw-body-header vector-page-titlebar"> <nav aria-label="Indice" class="vector-toc-landmark"> <div id="vector-page-titlebar-toc" class="vector-dropdown vector-page-titlebar-toc vector-button-flush-left" title="Indice" > <input type="checkbox" id="vector-page-titlebar-toc-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-page-titlebar-toc" class="vector-dropdown-checkbox " aria-label="Mostra/Nascondi l'indice" > <label id="vector-page-titlebar-toc-label" for="vector-page-titlebar-toc-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only " aria-hidden="true" ><span class="vector-icon mw-ui-icon-listBullet mw-ui-icon-wikimedia-listBullet"></span> <span class="vector-dropdown-label-text">Mostra/Nascondi l'indice</span> </label> <div class="vector-dropdown-content"> <div id="vector-page-titlebar-toc-unpinned-container" class="vector-unpinned-container"> </div> </div> </div> </nav> <h1 id="firstHeading" class="firstHeading mw-first-heading"><span class="mw-page-title-main">Sass</span></h1> <div id="p-lang-btn" class="vector-dropdown mw-portlet mw-portlet-lang" > <input type="checkbox" id="p-lang-btn-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-p-lang-btn" class="vector-dropdown-checkbox mw-interlanguage-selector" aria-label="Vai a una voce in un'altra lingua. Disponibile in 22 lingue" > <label id="p-lang-btn-label" for="p-lang-btn-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--action-progressive mw-portlet-lang-heading-22" aria-hidden="true" ><span class="vector-icon mw-ui-icon-language-progressive mw-ui-icon-wikimedia-language-progressive"></span> <span class="vector-dropdown-label-text">22 lingue</span> </label> <div class="vector-dropdown-content"> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li class="interlanguage-link interwiki-ar mw-list-item"><a href="https://ar.wikipedia.org/wiki/%D8%B3%D8%A7%D8%B3_(%D9%84%D8%BA%D8%A9_%D8%AA%D9%86%D8%B3%D9%8A%D9%82_%D8%B5%D9%81%D8%AD%D8%A7%D8%AA_%D8%A7%D9%84%D9%88%D9%8A%D8%A8)" title="ساس (لغة تنسيق صفحات الويب) - arabo" lang="ar" hreflang="ar" data-title="ساس (لغة تنسيق صفحات الويب)" data-language-autonym="العربية" data-language-local-name="arabo" class="interlanguage-link-target"><span>العربية</span></a></li><li class="interlanguage-link interwiki-az mw-list-item"><a href="https://az.wikipedia.org/wiki/Sass" title="Sass - azerbaigiano" lang="az" hreflang="az" data-title="Sass" data-language-autonym="Azərbaycanca" data-language-local-name="azerbaigiano" class="interlanguage-link-target"><span>Azərbaycanca</span></a></li><li class="interlanguage-link interwiki-bg mw-list-item"><a href="https://bg.wikipedia.org/wiki/SASS" title="SASS - bulgaro" lang="bg" hreflang="bg" data-title="SASS" data-language-autonym="Български" data-language-local-name="bulgaro" class="interlanguage-link-target"><span>Български</span></a></li><li class="interlanguage-link interwiki-ca mw-list-item"><a href="https://ca.wikipedia.org/wiki/Sass" title="Sass - catalano" lang="ca" hreflang="ca" data-title="Sass" data-language-autonym="Català" data-language-local-name="catalano" class="interlanguage-link-target"><span>Català</span></a></li><li class="interlanguage-link interwiki-de mw-list-item"><a href="https://de.wikipedia.org/wiki/Sass_(Stylesheet-Sprache)" title="Sass (Stylesheet-Sprache) - tedesco" lang="de" hreflang="de" data-title="Sass (Stylesheet-Sprache)" data-language-autonym="Deutsch" data-language-local-name="tedesco" class="interlanguage-link-target"><span>Deutsch</span></a></li><li class="interlanguage-link interwiki-en mw-list-item"><a href="https://en.wikipedia.org/wiki/Sass_(style_sheet_language)" title="Sass (style sheet language) - inglese" lang="en" hreflang="en" data-title="Sass (style sheet language)" data-language-autonym="English" data-language-local-name="inglese" class="interlanguage-link-target"><span>English</span></a></li><li class="interlanguage-link interwiki-es mw-list-item"><a href="https://es.wikipedia.org/wiki/Sass" title="Sass - spagnolo" lang="es" hreflang="es" data-title="Sass" data-language-autonym="Español" data-language-local-name="spagnolo" class="interlanguage-link-target"><span>Español</span></a></li><li class="interlanguage-link interwiki-et mw-list-item"><a href="https://et.wikipedia.org/wiki/Sass_(stiililehe_keel)" title="Sass (stiililehe keel) - estone" lang="et" hreflang="et" data-title="Sass (stiililehe keel)" data-language-autonym="Eesti" data-language-local-name="estone" class="interlanguage-link-target"><span>Eesti</span></a></li><li class="interlanguage-link interwiki-fa mw-list-item"><a href="https://fa.wikipedia.org/wiki/%D8%B3%D8%A7%D8%B3_(%D8%B2%D8%A8%D8%A7%D9%86_%D8%B3%D8%A8%DA%A9_%D9%86%D9%88%DB%8C%D8%B3%DB%8C)" title="ساس (زبان سبک نویسی) - persiano" lang="fa" hreflang="fa" data-title="ساس (زبان سبک نویسی)" data-language-autonym="فارسی" data-language-local-name="persiano" class="interlanguage-link-target"><span>فارسی</span></a></li><li class="interlanguage-link interwiki-fi mw-list-item"><a href="https://fi.wikipedia.org/wiki/Sass" title="Sass - finlandese" lang="fi" hreflang="fi" data-title="Sass" data-language-autonym="Suomi" data-language-local-name="finlandese" class="interlanguage-link-target"><span>Suomi</span></a></li><li class="interlanguage-link interwiki-fr mw-list-item"><a href="https://fr.wikipedia.org/wiki/Sass_(langage)" title="Sass (langage) - francese" lang="fr" hreflang="fr" data-title="Sass (langage)" data-language-autonym="Français" data-language-local-name="francese" class="interlanguage-link-target"><span>Français</span></a></li><li class="interlanguage-link interwiki-hy mw-list-item"><a href="https://hy.wikipedia.org/wiki/Sass" title="Sass - armeno" lang="hy" hreflang="hy" data-title="Sass" data-language-autonym="Հայերեն" data-language-local-name="armeno" class="interlanguage-link-target"><span>Հայերեն</span></a></li><li class="interlanguage-link interwiki-ja mw-list-item"><a href="https://ja.wikipedia.org/wiki/Sass" title="Sass - giapponese" lang="ja" hreflang="ja" data-title="Sass" data-language-autonym="日本語" data-language-local-name="giapponese" class="interlanguage-link-target"><span>日本語</span></a></li><li class="interlanguage-link interwiki-ko mw-list-item"><a href="https://ko.wikipedia.org/wiki/Sass_(%EC%8A%A4%ED%83%80%EC%9D%BC%EC%8B%9C%ED%8A%B8_%EC%96%B8%EC%96%B4)" title="Sass (스타일시트 언어) - coreano" lang="ko" hreflang="ko" data-title="Sass (스타일시트 언어)" data-language-autonym="한국어" data-language-local-name="coreano" class="interlanguage-link-target"><span>한국어</span></a></li><li class="interlanguage-link interwiki-ml mw-list-item"><a href="https://ml.wikipedia.org/wiki/%E0%B4%B8%E0%B4%BE%E0%B4%B8%E0%B5%8D_(%E0%B4%B8%E0%B5%8D%E0%B4%B1%E0%B5%8D%E0%B4%B1%E0%B5%88%E0%B5%BD%E2%80%8C%E0%B4%B7%E0%B5%80%E0%B4%B1%E0%B5%8D%E0%B4%B1%E0%B5%8D_%E0%B4%AD%E0%B4%BE%E0%B4%B7)" title="സാസ് (സ്റ്റൈൽ‌ഷീറ്റ് ഭാഷ) - malayalam" lang="ml" hreflang="ml" data-title="സാസ് (സ്റ്റൈൽ‌ഷീറ്റ് ഭാഷ)" data-language-autonym="മലയാളം" data-language-local-name="malayalam" class="interlanguage-link-target"><span>മലയാളം</span></a></li><li class="interlanguage-link interwiki-pt mw-list-item"><a href="https://pt.wikipedia.org/wiki/Sass_(linguagem_de_folhas_de_estilos)" title="Sass (linguagem de folhas de estilos) - portoghese" lang="pt" hreflang="pt" data-title="Sass (linguagem de folhas de estilos)" data-language-autonym="Português" data-language-local-name="portoghese" class="interlanguage-link-target"><span>Português</span></a></li><li class="interlanguage-link interwiki-ru mw-list-item"><a href="https://ru.wikipedia.org/wiki/Sass" title="Sass - russo" lang="ru" hreflang="ru" data-title="Sass" data-language-autonym="Русский" data-language-local-name="russo" class="interlanguage-link-target"><span>Русский</span></a></li><li class="interlanguage-link interwiki-sq mw-list-item"><a href="https://sq.wikipedia.org/wiki/Sass_(gjuh%C3%AB_p%C3%ABr_flet%C3%AB-stili)" title="Sass (gjuhë për fletë-stili) - albanese" lang="sq" hreflang="sq" data-title="Sass (gjuhë për fletë-stili)" data-language-autonym="Shqip" data-language-local-name="albanese" class="interlanguage-link-target"><span>Shqip</span></a></li><li class="interlanguage-link interwiki-sr mw-list-item"><a href="https://sr.wikipedia.org/wiki/Sass_(%D1%81%D1%82%D0%B8%D0%BB%D1%81%D0%BA%D0%B8_%D1%98%D0%B5%D0%B7%D0%B8%D0%BA)" title="Sass (стилски језик) - serbo" lang="sr" hreflang="sr" data-title="Sass (стилски језик)" data-language-autonym="Српски / srpski" data-language-local-name="serbo" class="interlanguage-link-target"><span>Српски / srpski</span></a></li><li class="interlanguage-link interwiki-tr mw-list-item"><a href="https://tr.wikipedia.org/wiki/SASS" title="SASS - turco" lang="tr" hreflang="tr" data-title="SASS" data-language-autonym="Türkçe" data-language-local-name="turco" class="interlanguage-link-target"><span>Türkçe</span></a></li><li class="interlanguage-link interwiki-uk mw-list-item"><a href="https://uk.wikipedia.org/wiki/Sass" title="Sass - ucraino" lang="uk" hreflang="uk" data-title="Sass" data-language-autonym="Українська" data-language-local-name="ucraino" class="interlanguage-link-target"><span>Українська</span></a></li><li class="interlanguage-link interwiki-zh mw-list-item"><a href="https://zh.wikipedia.org/wiki/Sass" title="Sass - cinese" lang="zh" hreflang="zh" data-title="Sass" data-language-autonym="中文" data-language-local-name="cinese" class="interlanguage-link-target"><span>中文</span></a></li> </ul> <div class="after-portlet after-portlet-lang"><span class="wb-langlinks-edit wb-langlinks-link"><a href="https://www.wikidata.org/wiki/Special:EntityPage/Q1572865#sitelinks-wikipedia" title="Modifica collegamenti interlinguistici" class="wbc-editpage">Modifica collegamenti</a></span></div> </div> </div> </div> </header> <div class="vector-page-toolbar"> <div class="vector-page-toolbar-container"> <div id="left-navigation"> <nav aria-label="Namespace"> <div id="p-associated-pages" class="vector-menu vector-menu-tabs mw-portlet mw-portlet-associated-pages" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="ca-nstab-main" class="selected vector-tab-noicon mw-list-item"><a href="/wiki/Sass" title="Vedi la voce [c]" accesskey="c"><span>Voce</span></a></li><li id="ca-talk" class="vector-tab-noicon mw-list-item"><a href="/wiki/Discussione:Sass" rel="discussion" title="Vedi le discussioni relative a questa pagina [t]" accesskey="t"><span>Discussione</span></a></li> </ul> </div> </div> <div id="vector-variants-dropdown" class="vector-dropdown emptyPortlet" > <input type="checkbox" id="vector-variants-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-variants-dropdown" class="vector-dropdown-checkbox " aria-label="Cambia versione linguistica" > <label id="vector-variants-dropdown-label" for="vector-variants-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet" aria-hidden="true" ><span class="vector-dropdown-label-text">italiano</span> </label> <div class="vector-dropdown-content"> <div id="p-variants" class="vector-menu mw-portlet mw-portlet-variants emptyPortlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> </ul> </div> </div> </div> </div> </nav> </div> <div id="right-navigation" class="vector-collapsible"> <nav aria-label="Visite"> <div id="p-views" class="vector-menu vector-menu-tabs mw-portlet mw-portlet-views" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="ca-view" class="selected vector-tab-noicon mw-list-item"><a href="/wiki/Sass"><span>Leggi</span></a></li><li id="ca-ve-edit" class="vector-tab-noicon mw-list-item"><a href="/w/index.php?title=Sass&veaction=edit" title="Modifica questa pagina [v]" accesskey="v"><span>Modifica</span></a></li><li id="ca-edit" class="collapsible vector-tab-noicon mw-list-item"><a href="/w/index.php?title=Sass&action=edit" title="Modifica il wikitesto di questa pagina [e]" accesskey="e"><span>Modifica wikitesto</span></a></li><li id="ca-history" class="vector-tab-noicon mw-list-item"><a href="/w/index.php?title=Sass&action=history" title="Versioni precedenti di questa pagina [h]" accesskey="h"><span>Cronologia</span></a></li> </ul> </div> </div> </nav> <nav class="vector-page-tools-landmark" aria-label="Strumenti pagine"> <div id="vector-page-tools-dropdown" class="vector-dropdown vector-page-tools-dropdown" > <input type="checkbox" id="vector-page-tools-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-page-tools-dropdown" class="vector-dropdown-checkbox " aria-label="Strumenti" > <label id="vector-page-tools-dropdown-label" for="vector-page-tools-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet" aria-hidden="true" ><span class="vector-dropdown-label-text">Strumenti</span> </label> <div class="vector-dropdown-content"> <div id="vector-page-tools-unpinned-container" class="vector-unpinned-container"> <div id="vector-page-tools" class="vector-page-tools vector-pinnable-element"> <div class="vector-pinnable-header vector-page-tools-pinnable-header vector-pinnable-header-unpinned" data-feature-name="page-tools-pinned" data-pinnable-element-id="vector-page-tools" data-pinned-container-id="vector-page-tools-pinned-container" data-unpinned-container-id="vector-page-tools-unpinned-container" > <div class="vector-pinnable-header-label">Strumenti</div> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-pin-button" data-event-name="pinnable-header.vector-page-tools.pin">sposta nella barra laterale</button> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button" data-event-name="pinnable-header.vector-page-tools.unpin">nascondi</button> </div> <div id="p-cactions" class="vector-menu mw-portlet mw-portlet-cactions emptyPortlet vector-has-collapsible-items" title="Altre opzioni" > <div class="vector-menu-heading"> Azioni </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="ca-more-view" class="selected vector-more-collapsible-item mw-list-item"><a href="/wiki/Sass"><span>Leggi</span></a></li><li id="ca-more-ve-edit" class="vector-more-collapsible-item mw-list-item"><a href="/w/index.php?title=Sass&veaction=edit" title="Modifica questa pagina [v]" accesskey="v"><span>Modifica</span></a></li><li id="ca-more-edit" class="collapsible vector-more-collapsible-item mw-list-item"><a href="/w/index.php?title=Sass&action=edit" title="Modifica il wikitesto di questa pagina [e]" accesskey="e"><span>Modifica wikitesto</span></a></li><li id="ca-more-history" class="vector-more-collapsible-item mw-list-item"><a href="/w/index.php?title=Sass&action=history"><span>Cronologia</span></a></li> </ul> </div> </div> <div id="p-tb" class="vector-menu mw-portlet mw-portlet-tb" > <div class="vector-menu-heading"> Generale </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="t-whatlinkshere" class="mw-list-item"><a href="/wiki/Speciale:PuntanoQui/Sass" title="Elenco di tutte le pagine che sono collegate a questa [j]" accesskey="j"><span>Puntano qui</span></a></li><li id="t-recentchangeslinked" class="mw-list-item"><a href="/wiki/Speciale:ModificheCorrelate/Sass" rel="nofollow" title="Elenco delle ultime modifiche alle pagine collegate a questa [k]" accesskey="k"><span>Modifiche correlate</span></a></li><li id="t-permalink" class="mw-list-item"><a href="/w/index.php?title=Sass&oldid=140111369" title="Collegamento permanente a questa versione di questa pagina"><span>Link permanente</span></a></li><li id="t-info" class="mw-list-item"><a href="/w/index.php?title=Sass&action=info" title="Ulteriori informazioni su questa pagina"><span>Informazioni pagina</span></a></li><li id="t-cite" class="mw-list-item"><a href="/w/index.php?title=Speciale:Cita&page=Sass&id=140111369&wpFormIdentifier=titleform" title="Informazioni su come citare questa pagina"><span>Cita questa voce</span></a></li><li id="t-urlshortener" class="mw-list-item"><a href="/w/index.php?title=Speciale:UrlShortener&url=https%3A%2F%2Fit.wikipedia.org%2Fwiki%2FSass"><span>Ottieni URL breve</span></a></li><li id="t-urlshortener-qrcode" class="mw-list-item"><a href="/w/index.php?title=Speciale:QrCode&url=https%3A%2F%2Fit.wikipedia.org%2Fwiki%2FSass"><span>Scarica codice QR</span></a></li> </ul> </div> </div> <div id="p-coll-print_export" class="vector-menu mw-portlet mw-portlet-coll-print_export" > <div class="vector-menu-heading"> Stampa/esporta </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="coll-create_a_book" class="mw-list-item"><a href="/w/index.php?title=Speciale:Libro&bookcmd=book_creator&referer=Sass"><span>Crea un libro</span></a></li><li id="coll-download-as-rl" class="mw-list-item"><a href="/w/index.php?title=Speciale:DownloadAsPdf&page=Sass&action=show-download-screen"><span>Scarica come PDF</span></a></li><li id="t-print" class="mw-list-item"><a href="/w/index.php?title=Sass&printable=yes" title="Versione stampabile di questa pagina [p]" accesskey="p"><span>Versione stampabile</span></a></li> </ul> </div> </div> <div id="p-wikibase-otherprojects" class="vector-menu mw-portlet mw-portlet-wikibase-otherprojects" > <div class="vector-menu-heading"> In altri progetti </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="t-wikibase" class="wb-otherproject-link wb-otherproject-wikibase-dataitem mw-list-item"><a href="https://www.wikidata.org/wiki/Special:EntityPage/Q1572865" title="Collegamento all'elemento connesso dell'archivio dati [g]" accesskey="g"><span>Elemento Wikidata</span></a></li> </ul> </div> </div> </div> </div> </div> </div> </nav> </div> </div> </div> <div class="vector-column-end"> <div class="vector-sticky-pinned-container"> <nav class="vector-page-tools-landmark" aria-label="Strumenti pagine"> <div id="vector-page-tools-pinned-container" class="vector-pinned-container"> </div> </nav> <nav class="vector-appearance-landmark" aria-label="Aspetto"> <div id="vector-appearance-pinned-container" class="vector-pinned-container"> <div id="vector-appearance" class="vector-appearance vector-pinnable-element"> <div class="vector-pinnable-header vector-appearance-pinnable-header vector-pinnable-header-pinned" data-feature-name="appearance-pinned" data-pinnable-element-id="vector-appearance" data-pinned-container-id="vector-appearance-pinned-container" data-unpinned-container-id="vector-appearance-unpinned-container" > <div class="vector-pinnable-header-label">Aspetto</div> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-pin-button" data-event-name="pinnable-header.vector-appearance.pin">sposta nella barra laterale</button> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button" data-event-name="pinnable-header.vector-appearance.unpin">nascondi</button> </div> </div> </div> </nav> </div> </div> <div id="bodyContent" class="vector-body" aria-labelledby="firstHeading" data-mw-ve-target-container> <div class="vector-body-before-content"> <div class="mw-indicators"> </div> <div id="siteSub" class="noprint">Da Wikipedia, l'enciclopedia libera.</div> </div> <div id="contentSub"><div id="mw-content-subtitle"></div></div> <div id="mw-content-text" class="mw-body-content"><div class="mw-content-ltr mw-parser-output" lang="it" dir="ltr"><style data-mw-deduplicate="TemplateStyles:r130658281">body:not(.skin-minerva) .mw-parser-output .hatnote.nota-disambigua{clear:both;margin-top:0;padding:.05em .5em}</style> <style data-mw-deduplicate="TemplateStyles:r139142988">.mw-parser-output .hatnote-content{align-items:center;display:flex}.mw-parser-output .hatnote-icon{flex-shrink:0}.mw-parser-output .hatnote-icon img{display:flex}.mw-parser-output .hatnote-text{font-style:italic}body:not(.skin-minerva) .mw-parser-output .hatnote{border:1px solid #CCC;display:flex;margin:.5em 0;padding:.2em .5em}body:not(.skin-minerva) .mw-parser-output .hatnote-text{padding-left:.5em}body.skin-minerva .mw-parser-output .hatnote-icon{padding-right:8px}body.skin-minerva .mw-parser-output .hatnote-icon img{height:auto;width:16px}body.skin--responsive .mw-parser-output .hatnote a.new{color:#d73333}body.skin--responsive .mw-parser-output .hatnote a.new:visited{color:#a55858}</style> <div class="hatnote noprint nota-disambigua"> <div class="hatnote-content"><span class="noviewer hatnote-icon" typeof="mw:File"><span><img src="//upload.wikimedia.org/wikipedia/commons/thumb/b/bc/Nota_disambigua.svg/18px-Nota_disambigua.svg.png" decoding="async" width="18" height="18" class="mw-file-element" srcset="//upload.wikimedia.org/wikipedia/commons/thumb/b/bc/Nota_disambigua.svg/27px-Nota_disambigua.svg.png 1.5x, //upload.wikimedia.org/wikipedia/commons/thumb/b/bc/Nota_disambigua.svg/36px-Nota_disambigua.svg.png 2x" data-file-width="200" data-file-height="200" /></span></span> <span class="hatnote-text"><a href="/wiki/Aiuto:Disambiguazione" title="Aiuto:Disambiguazione">Disambiguazione</a> – Se stai cercando il sito archeologico di Trento, vedi <b><a href="/wiki/Spazio_Archeologico_Sotterraneo_del_Sas" title="Spazio Archeologico Sotterraneo del Sas">Spazio Archeologico Sotterraneo del Sas</a></b>.</span></div> </div> <style data-mw-deduplicate="TemplateStyles:r143074810">.mw-parser-output .sinottico{background-color:#f8f9fa;border:1px solid #c8ccd1;border-spacing:0;clear:right;float:right;font-size:95%;line-height:1.4em;margin:0 0 1em 1.5em;width:280px}.mw-parser-output .sinottico caption{font-weight:bold}.mw-parser-output .sinottico>tbody>tr>th:not(:only-child),.mw-parser-output .sinottico_annidata>tbody>tr>th:not(:only-child){background-color:#f3f3f3;border-right:1px solid #e5e5e8;text-align:left;vertical-align:top}.mw-parser-output .sinottico>tbody>tr:not(:last-child)>td,.mw-parser-output .sinottico>tbody>tr:not(:last-child)>th,.mw-parser-output .sinottico_annidata>tbody>tr>td,.mw-parser-output .sinottico_annidata>tbody>tr>th{border-bottom:1px solid #e0e0e0}.mw-parser-output .sinottico>tbody>tr>td,.mw-parser-output .sinottico>tbody>tr>th:not(:only-child),.mw-parser-output .sinottico_annidata>tbody>tr>td,.mw-parser-output .sinottico_annidata>tbody>tr>th:not(:only-child){padding:.25em .4em}.mw-parser-output .sinottico>tbody>tr>td,.mw-parser-output .sinottico_annidata>tbody>tr>td{vertical-align:middle}.mw-parser-output .sinottico>tbody>tr>td>hr:only-child{margin:0.4em 0.2em}.mw-parser-output .sinottico ul{margin:0 0 0 1em;padding:0}.mw-parser-output .sinottico_annidata{border-spacing:0;margin:0 -.4em;width:calc(100% + calc(.4em*2))}.mw-parser-output .sinottico_annidata:last-child{margin-bottom:-.2em}.mw-parser-output .sinottico_annidata:last-child>tbody>tr:last-child>td,.mw-parser-output .sinottico_annidata:last-child>tbody>tr:last-child>th{border-bottom:none}.mw-parser-output .sinottico_divisione+.sinottico_divisione>th,.mw-parser-output .sinottico_testata+.sinottico_divisione>th{border-top:2px solid #f8f9fa}.mw-parser-output .sinottico_divisione th{background-color:#eeeeee;padding:.15em .4em;text-align:center}.mw-parser-output .sinottico_piede{text-align:center;font-size:90%;background:#EFEFEF}.mw-parser-output .sinottico_piede2{background-color:white;font-size:xx-small;padding-bottom:0;text-align:right}.mw-parser-output .sinottico_sottotitolo{font-size:80%}.mw-parser-output .sinottico_testata th{background-color:#dedede;font-size:116%;padding:.2em .4em;text-align:center}.mw-parser-output .sinottico_testo_centrale{text-align:center}</style><table class="infobox sinottico" summary="Tabella sinottica che riassume i principali dati del soggetto"><tbody><tr class="sinottico_testata"><th colspan="2" style="background:lightblue">Sass</th></tr><tr><td class="sinottico_testo_centrale" colspan="2"><figure class="mw-halign-center" typeof="mw:File/Frameless"><a href="/wiki/File:Sass_Logo_Color.svg" class="mw-file-description"><img src="//upload.wikimedia.org/wikipedia/commons/thumb/9/96/Sass_Logo_Color.svg/100px-Sass_Logo_Color.svg.png" decoding="async" width="100" height="75" class="mw-file-element" srcset="//upload.wikimedia.org/wikipedia/commons/thumb/9/96/Sass_Logo_Color.svg/150px-Sass_Logo_Color.svg.png 1.5x, //upload.wikimedia.org/wikipedia/commons/thumb/9/96/Sass_Logo_Color.svg/200px-Sass_Logo_Color.svg.png 2x" data-file-width="512" data-file-height="384" /></a><figcaption></figcaption></figure> </td></tr><tr><th><a href="/wiki/Estensione_(file)" class="mw-redirect" title="Estensione (file)">Estensione</a></th><td><code>.sass, .scss</code> </td></tr><tr><th><a href="/wiki/Tipo_MIME" class="mw-redirect" title="Tipo MIME">Tipo MIME</a></th><td><code>text/x-sass</code> </td></tr><tr><th>Sviluppatore</th><td><a href="/w/index.php?title=Nathan_Weizenbaum&action=edit&redlink=1" class="new" title="Nathan Weizenbaum (la pagina non esiste)">Nathan Weizenbaum</a>, <a href="/w/index.php?title=Chris_Eppstein&action=edit&redlink=1" class="new" title="Chris Eppstein (la pagina non esiste)">Chris Eppstein</a> </td></tr><tr><th>1ª pubblicazione</th><td>2007 </td></tr><tr><th>Ultima versione</th><td>dart-sass 1.54.0<sup id="cite_ref-1" class="reference"><a href="#cite_note-1"><span class="cite-bracket">[</span>1<span class="cite-bracket">]</span></a></sup> (7 luglio 2022) </td></tr><tr><th>Estensione di</th><td><a href="/wiki/CSS" title="CSS">CSS</a> </td></tr><tr><th><a href="/wiki/Sito_web" title="Sito web">Sito web</a></th><td><a rel="nofollow" class="external text" href="http://www.sass-lang.com">www.sass-lang.com</a> </td></tr><tr><td class="sinottico_piede2 noprint nomobile metadata" colspan="2"><a href="https://www.wikidata.org/wiki/Q1572865" class="extiw" title="d:Q1572865"><span title="Modifica i dati della voce Sass su Wikidata">Modifica dati su Wikidata</span></a><b> ·</b> <a href="/wiki/Template:Formato_file/man" title="Template:Formato file/man"><span title="Manuale del template Formato file">Manuale</span></a></td></tr></tbody></table> <p><b>Sass</b> (<b>S</b>yntactically <b>A</b>wesome <b>S</b>tyle<b>S</b>heets) è un'estensione del linguaggio <a href="/wiki/CSS" title="CSS">CSS</a> che permette di utilizzare <a href="/wiki/Variabile_(informatica)" title="Variabile (informatica)">variabili</a>, di creare <a href="/wiki/Funzione_(informatica)" title="Funzione (informatica)">funzioni</a> e di organizzare il foglio di stile in più <a href="/wiki/File" title="File">file</a>. </p><p>Il linguaggio Sass si basa sul concetto di <a href="/wiki/Preprocessore" title="Preprocessore">preprocessore</a> CSS, il quale serve a definire fogli di stile con una forma più semplice, completa e potente rispetto ai CSS e a generare file CSS ottimizzati, aggregando le strutture definite anche in modo complesso. È compatibile con tutte le versioni di CSS. </p><p>Sass è costituito da due sintassi<sup id="cite_ref-main6_2-0" class="reference"><a href="#cite_note-main6-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup>. La sintassi originale, chiamata "sintassi rientrata", utilizza una sintassi simile a Html. Utilizza il rientro per separare i blocchi di codice e i caratteri di nuova riga per separare le regole. La sintassi più recente, "SCSS" (Sassy CSS), utilizza la formattazione dei blocchi come quella dei CSS. Utilizza le parentesi graffe per indicare i blocchi di codice e il punto e virgola per separare le regole all'interno di un blocco. La sintassi rientrata e i file SCSS hanno tradizionalmente le estensioni .sass e .scss, rispettivamente. </p><p>CSS3 consiste in una serie di selettori e pseudo-selettori che raggruppano le regole che si applicano a loro. Sass (nel contesto più ampio di entrambe le sintassi) estende i CSS fornendo diversi meccanismi disponibili nei linguaggi di programmazione più tradizionali , in particolare i linguaggi orientati agli oggetti , ma che non sono disponibili per i CSS3 stessi. Quando SassScript viene interpretato, crea blocchi di regole CSS per vari selettori come definito dal file Sass. L'interprete Sass traduce SassScript in CSS. In alternativa, Sass può monitorare il file .sass o .scss e tradurlo in un file .css di output ogni volta che viene salvato il file .sass o .scss<sup id="cite_ref-tutorial_3-0" class="reference"><a href="#cite_note-tutorial-3"><span class="cite-bracket">[</span>3<span class="cite-bracket">]</span></a></sup>. </p><p>La sintassi indentata è un metalinguaggio. SCSS è un metalinguaggio annidato , poiché CSS valido è SCSS valido con la stessa semantica . </p><p>SassScript fornisce i seguenti meccanismi: variabili, annidamento, mixin ed ereditarietà del selettore<sup id="cite_ref-main6_2-1" class="reference"><a href="#cite_note-main6-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup>. </p> <meta property="mw:PageProp/toc" /> <div class="mw-heading mw-heading2"><h2 id="Installazione">Installazione</h2><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=1" title="Modifica la sezione Installazione" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=1" title="Edit section's source code: Installazione"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <p>L'implementazione originale di Sass era scritta in Ruby. Una volta installato Ruby per il proprio sistema operativo è possibile procedere con l'installazione di Sass tramite il comando <i>gem install sass</i>. </p><p>A partire dal 26 marzo 2019 Ruby Sass non è più ufficialmente supportato<sup id="cite_ref-4" class="reference"><a href="#cite_note-4"><span class="cite-bracket">[</span>4<span class="cite-bracket">]</span></a></sup>. Esistono tuttavia implementazioni di Sass in diversi linguaggi di programmazione e l'implementazione primaria è diventata quella scritta in <a href="/wiki/Dart_(linguaggio)" class="mw-redirect" title="Dart (linguaggio)">Dart</a><sup id="cite_ref-5" class="reference"><a href="#cite_note-5"><span class="cite-bracket">[</span>5<span class="cite-bracket">]</span></a></sup>. Nella pagina ufficiale di Sass per ogni implementazione sono disponibili le istruzioni per l'installazione. </p> <div class="mw-heading mw-heading2"><h2 id="Storia">Storia</h2><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=2" title="Modifica la sezione Storia" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=2" title="Edit section's source code: Storia"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <p>Sass è stato inizialmente progettato da Hampton Catlin e sviluppato da Natalie Weizenbaum. Dopo le sue versioni iniziali, Weizenbaum<sup id="cite_ref-about_6-0" class="reference"><a href="#cite_note-about-6"><span class="cite-bracket">[</span>6<span class="cite-bracket">]</span></a></sup> e Chris Eppstein hanno continuato ad estendere Sass con SassScript, un linguaggio di scripting usato nei file Sass. </p> <div class="mw-heading mw-heading2"><h2 id="Principali_implementazioni">Principali implementazioni</h2><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=3" title="Modifica la sezione Principali implementazioni" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=3" title="Edit section's source code: Principali implementazioni"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <p>SassScript è stato implementato in più lingue, le implementazioni degne di nota sono: </p> <ul><li>L'implementazione originale di Ruby open source creata nel 2006,<sup id="cite_ref-:03_7-0" class="reference"><a href="#cite_note-:03-7"><span class="cite-bracket">[</span>7<span class="cite-bracket">]</span></a></sup> allora è stata deprecata a causa della mancanza di manutentori e ha raggiunto la fine del ciclo di vita nel marzo 2019<sup id="cite_ref-8" class="reference"><a href="#cite_note-8"><span class="cite-bracket">[</span>8<span class="cite-bracket">]</span></a></sup>.</li> <li>L'implementazione ufficiale di Dart open source<sup id="cite_ref-:03_7-1" class="reference"><a href="#cite_note-:03-7"><span class="cite-bracket">[</span>7<span class="cite-bracket">]</span></a></sup>.</li> <li>libSass, l'implementazione ufficiale C ++ open source .</li> <li>l'implementazione JavaScript ufficiale, pubblicata come modulo "sass" su npm .</li> <li>JSass, un'implementazione Java non ufficiale<sup id="cite_ref-9" class="reference"><a href="#cite_note-9"><span class="cite-bracket">[</span>9<span class="cite-bracket">]</span></a></sup>.</li> <li>phamlp, un'implementazione SASS / SCSS non ufficiale in PHP<sup id="cite_ref-:03_7-2" class="reference"><a href="#cite_note-:03-7"><span class="cite-bracket">[</span>7<span class="cite-bracket">]</span></a></sup>.</li> <li>Vaadin ha un'implementazione Java di Sass.</li> <li>Firebug , un'estensione XUL ("legacy") per Firefox per lo sviluppo web.<sup id="cite_ref-doc4_10-0" class="reference"><a href="#cite_note-doc4-10"><span class="cite-bracket">[</span>10<span class="cite-bracket">]</span></a></sup> Da allora è stato deprecato a favore degli strumenti di sviluppo integrati in Firefox stesso. Ha smesso di funzionare da quando Firefox 57 ha abbandonato il supporto per le estensioni XUL.</li></ul> <div class="mw-heading mw-heading2"><h2 id="Caratteristiche">Caratteristiche</h2><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=4" title="Modifica la sezione Caratteristiche" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=4" title="Edit section's source code: Caratteristiche"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <div class="mw-heading mw-heading3"><h3 id="Variabili">Variabili</h3><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=5" title="Modifica la sezione Variabili" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=5" title="Edit section's source code: Variabili"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <p>Sass consente di definire le variabili. Le variabili iniziano con un segno di dollaro ( <code>$</code> ). Variabile assegnazione è fatto con un colon ( <code>:</code> )<sup id="cite_ref-doc4_10-1" class="reference"><a href="#cite_note-doc4-10"><span class="cite-bracket">[</span>10<span class="cite-bracket">]</span></a></sup>. </p><p>SassScript supporta quattro tipi di dati: </p> <ul><li>Numeri (comprese le unità)</li> <li>Stringhe (con virgolette o senza)</li> <li>Colori (nome o nomi)</li> <li>Booleani</li></ul> <p>Le variabili possono essere argomenti o risultati di una delle numerose funzioni disponibili.<sup id="cite_ref-functions_11-0" class="reference"><a href="#cite_note-functions-11"><span class="cite-bracket">[</span>11<span class="cite-bracket">]</span></a></sup> Durante la traduzione, i valori delle variabili vengono inseriti nel documento CSS di output<sup id="cite_ref-main6_2-2" class="reference"><a href="#cite_note-main6-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup>. </p> <table class="wikitable"> <tbody><tr> <th>SCSS </th> <th>Sass </th> <th>CSS Compilato </th></tr> <tr> <td> <pre>$primary-color: #3bbfce; $margin: 16px; .content-navigation { border-color: $primary-color; color: darken($primary-color, 10%); } .border { padding: $margin / 2; margin: $margin / 2; border-color: $primary-color; } </pre> </td> <td> <pre>$primary-color: #3bbfce $margin: 16px .content-navigation border-color: $primary-color color: darken($primary-color, 10%) .border padding: $margin/2 margin: $margin/2 border-color: $primary-color </pre> </td> <td> <pre>.content-navigation { border-color: #3bbfce; color: #2b9eab; } .border { padding: 8px; margin: 8px; border-color: #3bbfce; } </pre> </td></tr></tbody></table> <div class="mw-heading mw-heading3"><h3 id="Annidamento">Annidamento</h3><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=6" title="Modifica la sezione Annidamento" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=6" title="Edit section's source code: Annidamento"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <p>I CSS supportano l'annidamento logico, ma i blocchi di codice stessi non sono annidati. Sass consente di inserire il codice annidato l'uno nell'altro<sup id="cite_ref-main6_2-3" class="reference"><a href="#cite_note-main6-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup>. </p> <table class="wikitable"> <tbody><tr> <th>SCSS </th> <th>Sass </th> <th>CSS Compilato </th></tr> <tr> <td> <pre>table.hl { margin: 2em 0; td.ln { text-align: right; } } li { font: { family: serif; weight: bold; size: 1.3em; } } </pre> </td> <td> <pre>table.hl margin: 2em 0 td.ln text-align: right </pre> <pre>li font: family: serif weight: bold size: 1.3em </pre> </td> <td> <pre>table.hl { margin: 2em 0; } table.hl td.ln { text-align: right; } li { font-family: serif; font-weight: bold; font-size: 1.3em; } </pre> </td></tr></tbody></table> <p>Tipi più complicati di annidamento, inclusi l'annidamento dello spazio dei nomi e i riferimenti padre, sono discussi nella documentazione di Sass<sup id="cite_ref-doc4_10-2" class="reference"><a href="#cite_note-doc4-10"><span class="cite-bracket">[</span>10<span class="cite-bracket">]</span></a></sup>. </p> <table class="wikitable"> <tbody><tr> <th>SCSS </th> <th>Sass </th> <th>CSS Compilato </th></tr> <tr> <td> <pre>@mixin table-base { th { text-align: center; font-weight: bold; } td, th { padding: 2px; } } #data { @include table-base; } </pre> </td> <td> <pre>=table-base th text-align: center font-weight: bold td, th padding: 2px #data +table-base </pre> </td> <td> <pre>#data th { text-align: center; font-weight: bold; } #data td, #data th { padding: 2px; } </pre> </td></tr></tbody></table> <div class="mw-heading mw-heading4"><h4 id="Loop">Loop</h4><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=7" title="Modifica la sezione Loop" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=7" title="Edit section's source code: Loop"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <p>Sass consente l'iterazione sulle variabili utilizzando <code>@for</code>, <code>@each</code>e <code>@while</code>, che può essere utilizzato per applicare stili diversi a elementi con classi o ID simili. </p> <table class="wikitable"> <tbody><tr> <th>Sass </th> <th>CSS Compilato </th></tr> <tr> <td> <pre>$squareCount: 4 @for $i from 1 through $squareCount #square-#{$i} background-color: red width: 50px * $i height: 120px / $i </pre> </td> <td> <pre>#square-1 { background-color: red; width: 50px; height: 120px; } #square-2 { background-color: red; width: 100px; height: 60px; } #square-3 { background-color: red; width: 150px; height: 40px; } </pre> </td></tr></tbody></table> <div class="mw-heading mw-heading4"><h4 id="Argomenti">Argomenti</h4><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=8" title="Modifica la sezione Argomenti" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=8" title="Edit section's source code: Argomenti"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <p>Anche i mixin supportano gli argomenti<sup id="cite_ref-main6_2-4" class="reference"><a href="#cite_note-main6-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup>. </p> <table class="wikitable"> <tbody><tr> <th>Sass </th> <th>CSS Compilato </th></tr> <tr> <td> <pre>=left($dist) float: left margin-left: $dist #data +left(10px) </pre> </td> <td> <pre>#data { float: left; margin-left: 10px; } </pre> </td></tr></tbody></table> <div class="mw-heading mw-heading4"><h4 id="In_combinazione">In combinazione</h4><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=9" title="Modifica la sezione In combinazione" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=9" title="Edit section's source code: In combinazione"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <table class="wikitable"> <tbody><tr> <th>Sass </th> <th>CSS Compilato </th></tr> <tr> <td> <pre>=table-base th text-align: center font-weight: bold td, th padding: 2px =left($dist) float: left margin-left: $dist #data +left(10px) +table-base </pre> </td> <td> <pre>#data { float: left; margin-left: 10px; } #data th { text-align: center; font-weight: bold; } #data td, #data th { padding: 2px; } </pre> </td></tr></tbody></table> <div class="mw-heading mw-heading3"><h3 id="Eredità_del_selettore"><span id="Eredit.C3.A0_del_selettore"></span>Eredità del selettore</h3><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=10" title="Modifica la sezione Eredità del selettore" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=10" title="Edit section's source code: Eredità del selettore"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <p>Sebbene CSS3 supporti la gerarchia DOM ( Document Object Model ), non consente l'ereditarietà del selettore. In Sass, l'ereditarietà si ottiene inserendo una riga all'interno di un blocco di codice che utilizza la parola chiave @extend e fa riferimento a un altro selettore. Gli attributi del selettore esteso vengono applicati al selettore chiamante<sup id="cite_ref-main6_2-5" class="reference"><a href="#cite_note-main6-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup>. </p> <table class="wikitable"> <tbody><tr> <th>Sass </th> <th>CSS Compilato </th></tr> <tr> <td> <pre>.error border: 1px #f00 background: #fdd .error.intrusion font-size: 1.3em font-weight: bold .badError @extend .error border-width: 3px </pre> </td> <td> <pre>.error, .badError { border: 1px #f00; background: #fdd; } .error.intrusion, .badError.intrusion { font-size: 1.3em; font-weight: bold; } .badError { border-width: 3px; } </pre> </td></tr></tbody></table> <p>Sass supporta l'ereditarietà multipla.<sup id="cite_ref-doc4_10-3" class="reference"><a href="#cite_note-doc4-10"><span class="cite-bracket">[</span>10<span class="cite-bracket">]</span></a></sup>. </p> <div class="mw-heading mw-heading2"><h2 id="libSass">libSass</h2><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=11" title="Modifica la sezione libSass" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=11" title="Edit section's source code: libSass"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <p>Alla HTML5 Developer Conference del 2012, Hampton Catlin, il creatore di Sass, ha annunciato la versione 1.0 di libSass, un'implementazione C ++ open source di Sass sviluppata da Catlin, Aaron Leung e il team di ingegneri di Moovweb<sup id="cite_ref-libsass-html5conf_12-0" class="reference"><a href="#cite_note-libsass-html5conf-12"><span class="cite-bracket">[</span>12<span class="cite-bracket">]</span></a></sup>. attuale manutentore di Sass, Chris Eppstein, ha espresso l'intenzione di contribuire. </p><p>Secondo Catlin, libSass può essere "drop [ped] in qualsiasi cosa e includerà Sass ... Potresti rilasciarlo direttamente in Firefox oggi e compilare Firefox e verrà compilato lì. Abbiamo scritto il nostro parser da zero in assicurati che sia possibile "<sup id="cite_ref-13" class="reference"><a href="#cite_note-13"><span class="cite-bracket">[</span>13<span class="cite-bracket">]</span></a></sup>. </p><p>Gli obiettivi di progettazione di libSass sono: </p> <ul><li>Prestazioni: gli sviluppatori hanno segnalato aumenti di velocità 10 volte superiori rispetto all'implementazione Ruby di Sass<sup id="cite_ref-14" class="reference"><a href="#cite_note-14"><span class="cite-bracket">[</span>14<span class="cite-bracket">]</span></a></sup>.</li> <li>Integrazione più semplice: libSass semplifica l'integrazione di Sass in più software. Prima di libSass, l'integrazione di Sass in un linguaggio o in un prodotto software richiedeva il raggruppamento dell'intero interprete Ruby. Al contrario, libSass è una libreria collegabile staticamente con zero dipendenze esterne e un'interfaccia C-like, che rende facile avvolgere Sass direttamente in altri linguaggi e strumenti di programmazione. Ad esempio, ora esistono collegamenti libSass open source per Node, Go e Ruby<sup id="cite_ref-libsass-moovweb-blog_15-0" class="reference"><a href="#cite_note-libsass-moovweb-blog-15"><span class="cite-bracket">[</span>15<span class="cite-bracket">]</span></a></sup>.</li> <li>Compatibilità: l'obiettivo di libSass è la piena compatibilità con l'implementazione Ruby ufficiale di Sass. Questo obiettivo è stato raggiunto su libsass 3.3<sup id="cite_ref-16" class="reference"><a href="#cite_note-16"><span class="cite-bracket">[</span>16<span class="cite-bracket">]</span></a></sup>.</li></ul> <div class="mw-heading mw-heading2"><h2 id="Integrazione_IDE">Integrazione IDE</h2><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=12" title="Modifica la sezione Integrazione IDE" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=12" title="Edit section's source code: Integrazione IDE"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <table class="wikitable"> <caption>Integrazione IDE di Sass </caption> <tbody><tr> <th>IDE </th> <th>Software </th> <th>Sito web </th></tr> <tr> <th>Adobe Dreamweaver CC 2017 </th> <td> </td> <td>https://blogs.adobe.com/creativecloud/getting-started-with-css-preprocessors-less-and-sass/ </td></tr> <tr> <th>Eclipse </th> <td> </td> <td> </td></tr> <tr> <th>Emacs </th> <td>SCSS Mode </td> <td>https://github.com/antonj/scss-mode/ </td></tr> <tr> <th>JetBrains IntelliJ IDEA (Ultimate Edition) </th> <td> </td> <td>https://www.jetbrains.com/idea/ </td></tr> <tr> <th>JetBrains PhpStorm </th> <td> </td> <td>http://www.jetbrains.com/phpstorm/ </td></tr> <tr> <th>JetBrains RubyMine </th> <td> </td> <td>http://www.jetbrains.com/ruby/ </td></tr> <tr> <th>JetBrains WebStorm </th> <td> </td> <td>http://www.jetbrains.com/webstorm/ </td></tr> <tr> <th>Microsoft Visual Studio </th> <td>Mindscape </td> <td>http://www.mindscapehq.com/products/web-workbench </td></tr> <tr> <th>Microsoft Visual Studio </th> <td>SassyStudio </td> <td>http://visualstudiogallery.msdn.microsoft.com/85fa99a6-e4c6-4a1c-9f00-e6a8129b6f4d </td></tr> <tr> <th>Microsoft WebMatrix </th> <td> </td> <td>http://www.microsoft.com/web/ </td></tr> <tr> <th>NetBeans </th> <td> </td> <td>http://plugins.netbeans.org/plugin/34929/scss-support </td></tr> <tr> <th>Vim </th> <td>haml.zip </td> <td>http://www.vim.org/scripts/script.php?script_id=1433 </td></tr> <tr> <th>Atom </th> <td> </td> <td>https://github.com/atom/language-sass </td></tr> <tr> <th>Visual Studio Code </th> <td> </td> <td>https://code.visualstudio.com/Docs/languages/css </td></tr> <tr> <th>Sublime </th> <td> </td> <td>https://github.com/P233/Syntax-highlighting-for-Sass </td></tr> <tr> <th>Edit+ </th> <td> </td> <td>https://www.editplus.com/others.html </td></tr></tbody></table> <div class="mw-heading mw-heading2"><h2 id="Note">Note</h2><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=13" title="Modifica la sezione Note" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=13" title="Edit section's source code: Note"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <div class="mw-references-wrap mw-references-columns"><ol class="references"> <li id="cite_note-1"><a href="#cite_ref-1"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> <a rel="nofollow" class="external text" href="https://github.com/sass/dart-sass/blob/main/CHANGELOG.md"><span style="font-style:italic;">"dart-sass.changelog"</span></a>, su <span style="font-style:italic;">github.com</span>. <small>URL consultato il 7 luglio 2022</small>.</cite></span> </li> <li id="cite_note-main6-2"><span class="mw-cite-backlink"><b>^</b> <sup><i><a href="#cite_ref-main6_2-0">a</a></i></sup> <sup><i><a href="#cite_ref-main6_2-1">b</a></i></sup> <sup><i><a href="#cite_ref-main6_2-2">c</a></i></sup> <sup><i><a href="#cite_ref-main6_2-3">d</a></i></sup> <sup><i><a href="#cite_ref-main6_2-4">e</a></i></sup> <sup><i><a href="#cite_ref-main6_2-5">f</a></i></sup></span> <span class="reference-text"><cite class="citation web" style="font-style:normal"> Media Mark (3.2.12), <a rel="nofollow" class="external text" href="http://sass-lang.com/"><span style="font-style:italic;">Sass - Syntactically Awesome Stylesheets</span></a>, su <span style="font-style:italic;">sass-lang.com</span>. <small>URL consultato il 23 febbraio 2014</small>.</cite></span> </li> <li id="cite_note-tutorial-3"><a href="#cite_ref-tutorial_3-0"><b>^</b></a> <span class="reference-text"><a rel="nofollow" class="external text" href="http://sass-lang.com/tutorial.html">Sass - Syntactically Awesome Stylesheets</a> <a rel="nofollow" class="external text" href="https://web.archive.org/web/20131009053354/http://sass-lang.com/tutorial.html">Archiviato</a> il 9 ottobre 2013 in <a href="/wiki/Internet_Archive" title="Internet Archive">Internet Archive</a>. Tutorial</span> </li> <li id="cite_note-4"><a href="#cite_ref-4"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> <a rel="nofollow" class="external text" href="https://sass-lang.com/ruby-sass"><span style="font-style:italic;">Sass: Ruby Sass</span></a>, su <span style="font-style:italic;">sass-lang.com</span>. <small>URL consultato il 6 marzo 2019</small>.</cite></span> </li> <li id="cite_note-5"><a href="#cite_ref-5"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> <a rel="nofollow" class="external text" href="https://sass-lang.com/dart-sass"><span style="font-style:italic;">Sass: Dart Sass</span></a>, su <span style="font-style:italic;">sass-lang.com</span>. <small>URL consultato il 6 marzo 2019</small>.</cite></span> </li> <li id="cite_note-about-6"><a href="#cite_ref-about_6-0"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> <a rel="nofollow" class="external text" href="https://web.archive.org/web/20130901145805/http://sass-lang.com/about.html"><span style="font-style:italic;">Sass: Syntactically Awesome Style Sheets</span></a>, in <span style="font-style:italic;">sass-lang.com</span> <small>(archiviato dall'<abbr title="http://sass-lang.com/about.html">url originale</abbr> il 1º settembre 2013)</small>.</cite></span> </li> <li id="cite_note-:03-7"><span class="mw-cite-backlink"><b>^</b> <sup><i><a href="#cite_ref-:03_7-0">a</a></i></sup> <sup><i><a href="#cite_ref-:03_7-1">b</a></i></sup> <sup><i><a href="#cite_ref-:03_7-2">c</a></i></sup></span> <span class="reference-text"><cite class="citation web" style="font-style:normal"> <a rel="nofollow" class="external text" href="https://web.archive.org/web/20160310210318/https://www.drupal.org/project/sass"><span style="font-style:italic;">Sass / Scss</span></a>, su <span style="font-style:italic;">drupal.org</span>, 21 ottobre 2009. <small>URL consultato il 23 febbraio 2014</small> <small>(archiviato dall'<abbr title="http://drupal.org/project/sass">url originale</abbr> il 10 marzo 2016)</small>.</cite></span> </li> <li id="cite_note-8"><a href="#cite_ref-8"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> Natalie Weizenbaum, <a rel="nofollow" class="external text" href="http://sass.logdown.com/posts/7828841-ruby-sass-is-unsupported"><span style="font-style:italic;">Ruby Sass Has Reached End-Of-Life « Sass Blog</span></a>, su <span style="font-style:italic;">sass.logdown.com</span>. <small>URL consultato il 21 aprile 2019</small>.</cite></span> </li> <li id="cite_note-9"><a href="#cite_ref-9"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> <a rel="nofollow" class="external text" href="https://code.google.com/p/jsass/"><span style="font-style:italic;">jsass - A Java implementation of the Sass compiler (and some other goodies). - Google Project Hosting</span></a>, su <span style="font-style:italic;">code.google.com</span>. <small>URL consultato il 23 febbraio 2014</small>.</cite></span> </li> <li id="cite_note-doc4-10"><span class="mw-cite-backlink"><b>^</b> <sup><i><a href="#cite_ref-doc4_10-0">a</a></i></sup> <sup><i><a href="#cite_ref-doc4_10-1">b</a></i></sup> <sup><i><a href="#cite_ref-doc4_10-2">c</a></i></sup> <sup><i><a href="#cite_ref-doc4_10-3">d</a></i></sup></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html">Sass (Syntactically Awesome StyleSheets)</a> SASS_REFERENCE</span> </li> <li id="cite_note-functions-11"><a href="#cite_ref-functions_11-0"><b>^</b></a> <span class="reference-text"><a rel="nofollow" class="external text" href="http://sass-lang.com/docs/yardoc/Sass/Script/Functions.html">Module: Sass::Script::Functions</a> Sass Functions</span> </li> <li id="cite_note-libsass-html5conf-12"><a href="#cite_ref-libsass-html5conf_12-0"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> H. Catlin, <a rel="nofollow" class="external text" href="https://www.youtube.com/watch?v=j75-SslllvY#t=1831s"><span style="font-style:italic;">Hampton's 6 Rules of Mobile Design</span></a>, su <span style="font-style:italic;">youtube.com</span>, HTML5 Developer Conference, 15 ottobre 2012. <small>URL consultato l'11 luglio 2013</small>.</cite></span> </li> <li id="cite_note-13"><a href="#cite_ref-13"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> A. Stacoviak & A. Thorp, <a rel="nofollow" class="external text" href="https://web.archive.org/web/20130806073554/http://5by5.tv/changelog/94"><span style="font-style:italic;">Sass, libsass, Haml and more with Hampton Catlin</span></a>, su <span style="font-style:italic;">5by5.tv</span>, 26 giugno 2013. <small>URL consultato il 30 luglio 2013</small> <small>(archiviato dall'<abbr title="http://5by5.tv/changelog/94">url originale</abbr> il 6 agosto 2013)</small>.</cite></span> </li> <li id="cite_note-14"><a href="#cite_ref-14"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> D. Le Nouaille, <a rel="nofollow" class="external text" href="http://www.damln.com/log/sassc-and-bourbon-it-works/"><span style="font-style:italic;">Sassc and Bourbon</span></a>, su <span style="font-style:italic;">damln.com</span>, 7 giugno 2013. <small>URL consultato l'11 luglio 2013</small>.</cite></span> </li> <li id="cite_note-libsass-moovweb-blog-15"><a href="#cite_ref-libsass-moovweb-blog_15-0"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> M. Catlin, <a rel="nofollow" class="external text" href="https://web.archive.org/web/20130508080521/http://blog.moovweb.com/2012/04/libsass/"><span style="font-style:italic;">libsass</span></a>, su <span style="font-style:italic;">blog.moovweb.com</span>, Moovweb Blog, 30 aprile 2012. <small>URL consultato l'11 luglio 2013</small> <small>(archiviato dall'<abbr title="http://blog.moovweb.com/2012/04/libsass/">url originale</abbr> l'8 maggio 2013)</small>.</cite></span> </li> <li id="cite_note-16"><a href="#cite_ref-16"><b>^</b></a> <span class="reference-text"><cite class="citation web" style="font-style:normal"> <a rel="nofollow" class="external text" href="https://web.archive.org/web/20191205161602/http://sass-compatibility.github.io/"><span style="font-style:italic;">Sass Compatibility</span></a>, su <span style="font-style:italic;">sass-compatibility.github.io</span>. <small>URL consultato il 29 novembre 2019</small> <small>(archiviato dall'<abbr title="http://sass-compatibility.github.io/">url originale</abbr> il 5 dicembre 2019)</small>.</cite></span> </li> </ol></div> <div class="mw-heading mw-heading2"><h2 id="Voci_correlate">Voci correlate</h2><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=14" title="Modifica la sezione Voci correlate" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=14" title="Edit section's source code: Voci correlate"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <ul><li><a href="/wiki/LESS" title="LESS">LESS</a></li></ul> <div class="mw-heading mw-heading2"><h2 id="Collegamenti_esterni">Collegamenti esterni</h2><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=Sass&veaction=edit&section=15" title="Modifica la sezione Collegamenti esterni" class="mw-editsection-visualeditor"><span>modifica</span></a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=Sass&action=edit&section=15" title="Edit section's source code: Collegamenti esterni"><span>modifica wikitesto</span></a><span class="mw-editsection-bracket">]</span></span></div> <ul><li class="mw-empty-elt"></li> <li><cite class="citation web" style="font-style:normal">(<span style="font-weight:bolder; font-size:80%"><abbr title="inglese">EN</abbr></span>) <a rel="nofollow" class="external text" href="https://sass-lang.com/"><span style="font-style:italic;">Sito ufficiale</span></a>, su <span style="font-style:italic;">sass-lang.com</span>.</cite> <span class="mw-valign-text-top noprint" typeof="mw:File/Frameless"><a href="https://www.wikidata.org/wiki/Q1572865#P856" title="Modifica su Wikidata"><img alt="Modifica su Wikidata" src="//upload.wikimedia.org/wikipedia/commons/thumb/7/73/Blue_pencil.svg/20px-Blue_pencil.svg.png" decoding="async" width="10" height="10" class="mw-file-element" data-file-width="600" data-file-height="600" /></a></span></li> <li><cite class="citation web" style="font-style:normal">(<span style="font-weight:bolder; font-size:80%"><abbr title="inglese">EN</abbr></span>) <a rel="nofollow" class="external text" href="https://github.com/sass"><span style="font-style:italic;">Sass</span></a>, su <span style="font-style:italic;"><a href="/wiki/GitHub" title="GitHub">GitHub</a></span>.</cite> <span class="mw-valign-text-top noprint" typeof="mw:File/Frameless"><a href="https://www.wikidata.org/wiki/Q1572865#P2037" title="Modifica su Wikidata"><img alt="Modifica su Wikidata" src="//upload.wikimedia.org/wikipedia/commons/thumb/7/73/Blue_pencil.svg/20px-Blue_pencil.svg.png" decoding="async" width="10" height="10" class="mw-file-element" data-file-width="600" data-file-height="600" /></a></span></li> <li><a rel="nofollow" class="external text" href="http://sass-lang.com/">Sito ufficiale</a> (inglese)</li> <li><a rel="nofollow" class="external text" href="http://www.html.it/guide/guida-sass/">Guida Sass su html.it</a> (italiano)</li> <li><a rel="nofollow" class="external text" href="https://www.w3schools.com/sass/default.asp">Tutorial Sass su w3schools.com</a> (inglese)</li></ul> <style data-mw-deduplicate="TemplateStyles:r141815314">.mw-parser-output .navbox{border:1px solid #aaa;clear:both;margin:auto;padding:2px;width:100%}.mw-parser-output .navbox th{padding-left:1em;padding-right:1em;text-align:center}.mw-parser-output .navbox>tbody>tr:first-child>th{background:#ccf;font-size:90%;width:100%;color:var(--color-base,black)}.mw-parser-output .navbox_navbar{float:left;margin:0;padding:0 10px 0 0;text-align:left;width:6em}.mw-parser-output .navbox_title{font-size:110%}.mw-parser-output .navbox_abovebelow{background:#ddf;font-size:90%;font-weight:normal}.mw-parser-output .navbox_group{background:#ddf;font-size:90%;padding:0 10px;white-space:nowrap}.mw-parser-output .navbox_list{font-size:90%;width:100%}.mw-parser-output .navbox_list a{white-space:nowrap}html:not(.vector-feature-night-mode-enabled) .mw-parser-output .navbox_odd{background:#fdfdfd;color:var(--color-base,black)}html:not(.vector-feature-night-mode-enabled) .mw-parser-output .navbox_even{background:#f7f7f7;color:var(--color-base,black)}.mw-parser-output .navbox a.mw-selflink{color:var(--color-base,black)}.mw-parser-output .navbox_center{text-align:center}.mw-parser-output .navbox .navbox_image{padding-left:7px;vertical-align:middle;width:0}.mw-parser-output .navbox+.navbox{margin-top:-1px}.mw-parser-output .navbox .mw-collapsible-toggle{font-weight:normal;text-align:right;width:7em}body.skin--responsive .mw-parser-output .navbox_image img{max-width:none!important}.mw-parser-output .subnavbox{margin:-3px;width:100%}.mw-parser-output .subnavbox_group{background:#e6e6ff;padding:0 10px}@media screen{html.skin-theme-clientpref-night .mw-parser-output .navbox>tbody>tr:first-child>th{background:var(--background-color-interactive)!important}html.skin-theme-clientpref-night .mw-parser-output .navbox th{color:var(--color-base)!important}html.skin-theme-clientpref-night .mw-parser-output .navbox_abovebelow,html.skin-theme-clientpref-night .mw-parser-output .navbox_group{background:var(--background-color-interactive-subtle)!important}html.skin-theme-clientpref-night .mw-parser-output .subnavbox_group{background:var(--background-color-neutral-subtle)!important}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .navbox>tbody>tr:first-child>th{background:var(--background-color-interactive)!important}html.skin-theme-clientpref-os .mw-parser-output .navbox th{color:var(--color-base)!important}html.skin-theme-clientpref-os .mw-parser-output .navbox_abovebelow,html.skin-theme-clientpref-os .mw-parser-output .navbox_group{background:var(--background-color-interactive-subtle)!important}html.skin-theme-clientpref-os .mw-parser-output .subnavbox_group{background:var(--background-color-neutral-subtle)!important}}</style><table class="navbox mw-collapsible mw-collapsed noprint metadata" id="navbox-Linguaggi_foglio_di_stile"><tbody><tr><th colspan="2"><div class="navbox_navbar"><div class="noprint plainlinks" style="background-color:transparent; padding:0; font-size:xx-small; color:var(--color-base, #000000); white-space:nowrap;"><a href="/wiki/Template:Linguaggi_foglio_di_stile" title="Template:Linguaggi foglio di stile"><span title="Vai alla pagina del template">V</span></a> · <a href="/wiki/Discussioni_template:Linguaggi_foglio_di_stile" title="Discussioni template:Linguaggi foglio di stile"><span title="Discuti del template">D</span></a> · <a class="external text" href="https://it.wikipedia.org/w/index.php?title=Template:Linguaggi_foglio_di_stile&action=edit"><span title="Modifica il template. Usa l'anteprima prima di salvare">M</span></a></div></div><span class="navbox_title"><a href="/w/index.php?title=Linguaggio_del_foglio_di_stile&action=edit&redlink=1" class="new" title="Linguaggio del foglio di stile (la pagina non esiste)">Linguaggi del foglio di stile</a></span></th></tr><tr><th colspan="1" class="navbox_group">Modi</th><td colspan="1" class="navbox_list navbox_odd"><a href="/w/index.php?title=Desktop_publishing_dei_fogli_di_stile&action=edit&redlink=1" class="new" title="Desktop publishing dei fogli di stile (la pagina non esiste)">Desktop publishing</a><b> ·</b> <a href="/w/index.php?title=Sviluppo_web_dei_fogli_di_stile&action=edit&redlink=1" class="new" title="Sviluppo web dei fogli di stile (la pagina non esiste)">Sviluppo web</a><b> ·</b> <a href="/w/index.php?title=Linguaggio_dei_fogli_di_stile_per_l%27interfaccia_utente&action=edit&redlink=1" class="new" title="Linguaggio dei fogli di stile per l'interfaccia utente (la pagina non esiste)">Interfaccia utente</a></td></tr><tr><th colspan="1" class="navbox_group">Standard</th><td colspan="1" class="navbox_list navbox_even"><a href="/wiki/CSS" title="CSS">CSS</a><b> ·</b> <a href="/w/index.php?title=Document_Style_Semantics_and_Specification_Language&action=edit&redlink=1" class="new" title="Document Style Semantics and Specification Language (la pagina non esiste)">DSSSL</a><b> ·</b> <a href="/wiki/Extensible_Stylesheet_Language" title="Extensible Stylesheet Language">XSL</a></td></tr><tr><th colspan="1" class="navbox_group">Non-standard</th><td colspan="1" class="navbox_list navbox_odd"><a href="/w/index.php?title=JavaScript_Style_Sheets&action=edit&redlink=1" class="new" title="JavaScript Style Sheets (la pagina non esiste)">JSSS</a><b> ·</b> <a href="/w/index.php?title=Formatting_Output_Specification_Instance&action=edit&redlink=1" class="new" title="Formatting Output Specification Instance (la pagina non esiste)">FOSI</a><b> ·</b> <a href="/w/index.php?title=Fogli_di_stile_Qt&action=edit&redlink=1" class="new" title="Fogli di stile Qt (la pagina non esiste)">Fogli di stile Qt</a><b> ·</b> <a class="mw-selflink selflink">Sass</a><b> ·</b> <a href="/wiki/LESS" title="LESS">LESS</a><b> ·</b> <a href="/w/index.php?title=SMIL_Timesheets&action=edit&redlink=1" class="new" title="SMIL Timesheets (la pagina non esiste)">SMIL Timesheets</a></td></tr><tr><th colspan="1" class="navbox_group">Voci correlate</th><td colspan="1" class="navbox_list navbox_even"><a href="/w/index.php?title=Comparazione_fra_i_linguaggi_del_foglio_di_stile&action=edit&redlink=1" class="new" title="Comparazione fra i linguaggi del foglio di stile (la pagina non esiste)">Comparazione</a><b> ·</b> <a href="/w/index.php?title=Linguaggi_del_foglio_di_stile&action=edit&redlink=1" class="new" title="Linguaggi del foglio di stile (la pagina non esiste)">Lista</a></td></tr></tbody></table> <div class="noprint" style="width:100%; padding: 3px 0; display: flex; flex-wrap: wrap; row-gap: 4px; column-gap: 8px; box-sizing: border-box;"><div style="flex-grow: 1"><style data-mw-deduplicate="TemplateStyles:r140555418">.mw-parser-output .itwiki-template-occhiello{width:100%;line-height:25px;border:1px solid #CCF;background-color:#F0EEFF;box-sizing:border-box}.mw-parser-output .itwiki-template-occhiello-progetto{background-color:#FAFAFA}@media screen{html.skin-theme-clientpref-night .mw-parser-output .itwiki-template-occhiello{background-color:#202122;border-color:#54595D}html.skin-theme-clientpref-night .mw-parser-output .itwiki-template-occhiello-progetto{background-color:#282929}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .itwiki-template-occhiello{background-color:#202122;border-color:#54595D}html.skin-theme-clientpref-os .mw-parser-output .itwiki-template-occhiello-progetto{background-color:#282929}}</style><div class="itwiki-template-occhiello"><span class="noviewer" typeof="mw:File"><a href="/wiki/File:Applications-internet.svg" class="mw-file-description" title="Internet"><img alt=" " src="//upload.wikimedia.org/wikipedia/commons/thumb/7/70/Applications-internet.svg/25px-Applications-internet.svg.png" decoding="async" width="25" height="25" class="mw-file-element" srcset="//upload.wikimedia.org/wikipedia/commons/thumb/7/70/Applications-internet.svg/38px-Applications-internet.svg.png 1.5x, //upload.wikimedia.org/wikipedia/commons/thumb/7/70/Applications-internet.svg/50px-Applications-internet.svg.png 2x" data-file-width="48" data-file-height="48" /></a></span> <b><a href="/wiki/Portale:Internet" title="Portale:Internet">Portale Internet</a></b>: accedi alle voci di Wikipedia che trattano di internet</div></div></div>    </div><noscript><img src="https://auth.wikimedia.org/loginwiki/wiki/Special:CentralAutoLogin/start?useformat=desktop&type=1x1&usesul3=1" alt="" width="1" height="1" style="border: none; position: absolute;"></noscript> <div class="printfooter" data-nosnippet="">Estratto da "<a dir="ltr" href="https://it.wikipedia.org/w/index.php?title=Sass&oldid=140111369">https://it.wikipedia.org/w/index.php?title=Sass&oldid=140111369</a>"</div></div> <div id="catlinks" class="catlinks" data-mw="interface"><div id="mw-normal-catlinks" class="mw-normal-catlinks"><a href="/wiki/Categoria:Categorie" title="Categoria:Categorie">Categorie</a>: <ul><li><a href="/wiki/Categoria:CSS" title="Categoria:CSS">CSS</a></li><li><a href="/wiki/Categoria:Linguaggi_per_fogli_di_stile" title="Categoria:Linguaggi per fogli di stile">Linguaggi per fogli di stile</a></li><li><a href="/wiki/Categoria:Standard_W3C" title="Categoria:Standard W3C">Standard W3C</a></li><li><a href="/wiki/Categoria:Standard_Internet" title="Categoria:Standard Internet">Standard Internet</a></li></ul></div><div id="mw-hidden-catlinks" class="mw-hidden-catlinks mw-hidden-cats-hidden">Categorie nascoste: <ul><li><a href="/wiki/Categoria:Template_Webarchive_-_collegamenti_all%27Internet_Archive" title="Categoria:Template Webarchive - collegamenti all'Internet Archive">Template Webarchive - collegamenti all'Internet Archive</a></li><li><a href="/wiki/Categoria:P856_letta_da_Wikidata" title="Categoria:P856 letta da Wikidata">P856 letta da Wikidata</a></li><li><a href="/wiki/Categoria:P2037_letta_da_Wikidata" title="Categoria:P2037 letta da Wikidata">P2037 letta da Wikidata</a></li></ul></div></div> </div> </main> </div> <div class="mw-footer-container"> <footer id="footer" class="mw-footer" > <ul id="footer-info"> <li id="footer-info-lastmod"> Questa pagina è stata modificata per l'ultima volta il 9 lug 2024 alle 15:55.</li> <li id="footer-info-copyright">Il testo è disponibile secondo la <a rel="nofollow" class="external text" href="https://creativecommons.org/licenses/by-sa/4.0/deed.it">licenza Creative Commons Attribuzione-Condividi allo stesso modo</a>; possono applicarsi condizioni ulteriori. Vedi le <a class="external text" href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Terms_of_Use/it">condizioni d'uso</a> per i dettagli.</li> </ul> <ul id="footer-places"> <li id="footer-places-privacy"><a href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Privacy_policy/it">Informativa sulla privacy</a></li> <li id="footer-places-about"><a href="/wiki/Wikipedia:Sala_stampa/Wikipedia">Informazioni su Wikipedia</a></li> <li id="footer-places-disclaimers"><a href="/wiki/Wikipedia:Avvertenze_generali">Avvertenze</a></li> <li id="footer-places-wm-codeofconduct"><a href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Universal_Code_of_Conduct">Codice di condotta</a></li> <li id="footer-places-developers"><a href="https://developer.wikimedia.org">Sviluppatori</a></li> <li id="footer-places-statslink"><a href="https://stats.wikimedia.org/#/it.wikipedia.org">Statistiche</a></li> <li id="footer-places-cookiestatement"><a href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Cookie_statement">Dichiarazione sui cookie</a></li> <li id="footer-places-mobileview"><a href="//it.m.wikipedia.org/w/index.php?title=Sass&mobileaction=toggle_view_mobile" class="noprint stopMobileRedirectToggle">Versione mobile</a></li> </ul> <ul id="footer-icons" class="noprint"> <li id="footer-copyrightico"><a href="https://www.wikimedia.org/" class="cdx-button cdx-button--fake-button cdx-button--size-large cdx-button--fake-button--enabled"><picture><source media="(min-width: 500px)" srcset="/static/images/footer/wikimedia-button.svg" width="84" height="29"><img src="/static/images/footer/wikimedia.svg" width="25" height="25" alt="Wikimedia Foundation" lang="en" loading="lazy"></picture></a></li> <li id="footer-poweredbyico"><a href="https://www.mediawiki.org/" class="cdx-button cdx-button--fake-button cdx-button--size-large cdx-button--fake-button--enabled"><picture><source media="(min-width: 500px)" srcset="/w/resources/assets/poweredby_mediawiki.svg" width="88" height="31"><img src="/w/resources/assets/mediawiki_compact.svg" alt="Powered by MediaWiki" lang="en" width="25" height="25" loading="lazy"></picture></a></li> </ul> </footer> </div> </div> </div> <div class="vector-header-container vector-sticky-header-container"> <div id="vector-sticky-header" class="vector-sticky-header"> <div class="vector-sticky-header-start"> <div class="vector-sticky-header-icon-start vector-button-flush-left vector-button-flush-right" aria-hidden="true"> <button class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-sticky-header-search-toggle" tabindex="-1" data-event-name="ui.vector-sticky-search-form.icon"><span class="vector-icon mw-ui-icon-search mw-ui-icon-wikimedia-search"></span> <span>Ricerca</span> </button> </div> <div role="search" class="vector-search-box-vue vector-search-box-show-thumbnail vector-search-box"> <div class="vector-typeahead-search-container"> <div class="cdx-typeahead-search cdx-typeahead-search--show-thumbnail"> <form action="/w/index.php" id="vector-sticky-search-form" class="cdx-search-input cdx-search-input--has-end-button"> <div class="cdx-search-input__input-wrapper" data-search-loc="header-moved"> <div class="cdx-text-input cdx-text-input--has-start-icon"> <input class="cdx-text-input__input" type="search" name="search" placeholder="Cerca in Wikipedia"> <span class="cdx-text-input__icon cdx-text-input__start-icon"></span> </div> <input type="hidden" name="title" value="Speciale:Ricerca"> </div> <button class="cdx-button cdx-search-input__end-button">Ricerca</button> </form> </div> </div> </div> <div class="vector-sticky-header-context-bar"> <nav aria-label="Indice" class="vector-toc-landmark"> <div id="vector-sticky-header-toc" class="vector-dropdown mw-portlet mw-portlet-sticky-header-toc vector-sticky-header-toc vector-button-flush-left" > <input type="checkbox" id="vector-sticky-header-toc-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-sticky-header-toc" class="vector-dropdown-checkbox " aria-label="Mostra/Nascondi l'indice" > <label id="vector-sticky-header-toc-label" for="vector-sticky-header-toc-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only " aria-hidden="true" ><span class="vector-icon mw-ui-icon-listBullet mw-ui-icon-wikimedia-listBullet"></span> <span class="vector-dropdown-label-text">Mostra/Nascondi l'indice</span> </label> <div class="vector-dropdown-content"> <div id="vector-sticky-header-toc-unpinned-container" class="vector-unpinned-container"> </div> </div> </div> </nav> <div class="vector-sticky-header-context-bar-primary" aria-hidden="true" ><span class="mw-page-title-main">Sass</span></div> </div> </div> <div class="vector-sticky-header-end" aria-hidden="true"> <div class="vector-sticky-header-icons"> <a href="#" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only" id="ca-talk-sticky-header" tabindex="-1" data-event-name="talk-sticky-header"><span class="vector-icon mw-ui-icon-speechBubbles mw-ui-icon-wikimedia-speechBubbles"></span> <span></span> </a> <a href="#" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only" id="ca-subject-sticky-header" tabindex="-1" data-event-name="subject-sticky-header"><span class="vector-icon mw-ui-icon-article mw-ui-icon-wikimedia-article"></span> <span></span> </a> <a href="#" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only" id="ca-history-sticky-header" tabindex="-1" data-event-name="history-sticky-header"><span class="vector-icon mw-ui-icon-wikimedia-history mw-ui-icon-wikimedia-wikimedia-history"></span> <span></span> </a> <a href="#" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only mw-watchlink" id="ca-watchstar-sticky-header" tabindex="-1" data-event-name="watch-sticky-header"><span class="vector-icon mw-ui-icon-wikimedia-star mw-ui-icon-wikimedia-wikimedia-star"></span> <span></span> </a> <a href="#" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only" id="ca-ve-edit-sticky-header" tabindex="-1" data-event-name="ve-edit-sticky-header"><span class="vector-icon mw-ui-icon-wikimedia-edit mw-ui-icon-wikimedia-wikimedia-edit"></span> <span></span> </a> <a href="#" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only" id="ca-edit-sticky-header" tabindex="-1" data-event-name="wikitext-edit-sticky-header"><span class="vector-icon mw-ui-icon-wikimedia-wikiText mw-ui-icon-wikimedia-wikimedia-wikiText"></span> <span></span> </a> <a href="#" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only" id="ca-viewsource-sticky-header" tabindex="-1" data-event-name="ve-edit-protected-sticky-header"><span class="vector-icon mw-ui-icon-wikimedia-editLock mw-ui-icon-wikimedia-wikimedia-editLock"></span> <span></span> </a> </div> <div class="vector-sticky-header-buttons"> <button class="cdx-button cdx-button--weight-quiet mw-interlanguage-selector" id="p-lang-btn-sticky-header" tabindex="-1" data-event-name="ui.dropdown-p-lang-btn-sticky-header"><span class="vector-icon mw-ui-icon-wikimedia-language mw-ui-icon-wikimedia-wikimedia-language"></span> <span>22 lingue</span> </button> <a href="#" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--action-progressive" id="ca-addsection-sticky-header" tabindex="-1" data-event-name="addsection-sticky-header"><span class="vector-icon mw-ui-icon-speechBubbleAdd-progressive mw-ui-icon-wikimedia-speechBubbleAdd-progressive"></span> <span>Aggiungi argomento</span> </a> </div> <div class="vector-sticky-header-icon-end"> <div class="vector-user-links"> </div> </div> </div> </div> </div> <div class="mw-portlet mw-portlet-dock-bottom emptyPortlet" id="p-dock-bottom"> <ul> </ul> </div> <script>(RLQ=window.RLQ||[]).push(function(){mw.config.set({"wgHostname":"mw-web.codfw.main-6f7c94ff49-65jxj","wgBackendResponseTime":149,"wgPageParseReport":{"limitreport":{"cputime":"0.280","walltime":"0.388","ppvisitednodes":{"value":2169,"limit":1000000},"postexpandincludesize":{"value":24632,"limit":2097152},"templateargumentsize":{"value":1011,"limit":2097152},"expansiondepth":{"value":14,"limit":100},"expensivefunctioncount":{"value":1,"limit":500},"unstrip-depth":{"value":0,"limit":20},"unstrip-size":{"value":20482,"limit":5000000},"entityaccesscount":{"value":1,"limit":400},"timingprofile":["100.00% 339.846 1 -total"," 30.35% 103.143 1 Template:Collegamenti_esterni"," 23.97% 81.477 1 Template:Formato_file"," 22.75% 77.320 1 Template:Infobox"," 11.18% 37.994 1 Template:Linguaggi_foglio_di_stile"," 10.86% 36.922 2 Template:Immagine_sinottico"," 10.41% 35.390 13 Template:Cita_web"," 10.17% 34.552 1 Template:Navbox"," 9.77% 33.202 1 Template:Nota_disambigua"," 7.95% 27.018 1 Template:Avviso_permanente"]},"scribunto":{"limitreport-timeusage":{"value":"0.152","limit":"10.000"},"limitreport-memusage":{"value":4886568,"limit":52428800}},"cachereport":{"origin":"mw-web.eqiad.main-6df8dbf59d-m7snh","timestamp":"20250331074236","ttl":2592000,"transientcontent":false}}});});</script> <script type="application/ld+json">{"@context":"https:\/\/schema.org","@type":"Article","name":"Sass","url":"https:\/\/it.wikipedia.org\/wiki\/Sass","sameAs":"http:\/\/www.wikidata.org\/entity\/Q1572865","mainEntity":"http:\/\/www.wikidata.org\/entity\/Q1572865","author":{"@type":"Organization","name":"Contributori ai progetti Wikimedia"},"publisher":{"@type":"Organization","name":"Wikimedia Foundation, Inc.","logo":{"@type":"ImageObject","url":"https:\/\/www.wikimedia.org\/static\/images\/wmf-hor-googpub.png"}},"datePublished":"2013-10-17T15:53:29Z","dateModified":"2024-07-09T13:55:59Z","headline":"linguaggio di programmazione"}</script> </body> </html>