Sass Wikipedia
Sass (short for syntactically awesome style sheets)
is a preprocessor scripting language
that is interpreted or compiled into
Cascading Style Sheets (CSS).
Sass(语法上很棒的样式表的缩写)
是预处理器脚本语言
被解释或编译成
级联样式表。
SassScript is the scripting language itself.
SassScript是脚本语言本身。
Sass consists of two syntaxes.
Sass由两种语法组成。
The original syntax,
called "the indented syntax,"
uses a syntax similar to Haml.
原始语法，
叫做“缩进语法”
使用类似于Haml的语法。
Haml
Haml
(HTML Abstraction Markup Language)
is a templating system
that is designed to
avoid writing inline code
in a web document
and make the HTML cleaner.
Haml
(超文本标记语言抽象标记语言)
是一个模板系统
旨在
避免编写内联代码
在web文档中
并使HTML更加清晰。
Haml gives the flexibility to
have some dynamic content
in HTML.
Haml提供了以下灵活性
有一些动态内容
在HTML中。
Similar to other web languages
like PHP, ASP, JSP
and template systems
like eRuby,
Haml also embeds some code
that gets executed
during runtime
and generates HTML code
in order to
provide some dynamic content.
类似于其他网络语言
像PHP，ASP，JSP
和模板系统
像eRuby一样，
Haml还嵌入了一些代码
在运行时执行的
并生成HTML代码
为了
提供一些动态内容。
In order to run Haml code,
files need to have a .haml extension.
为了运行Haml代码，
文件需要有. haml扩展名。
These files are similar to
.erb or eRuby files
which also help to
embed Ruby code
while developing a web application.
这些文件类似于
.erb或eRuby文件
这有助于
嵌入Ruby代码
同时开发网络应用程序。
While parsing coding comments,
Haml uses the same rules as Ruby 1.9 or later.
解析编码内容时，
Haml使用与Ruby 1.9或更高版本相同的规则。
Haml understands only ASCII compatible encodings
like UTF-8 but not UTF-16 or UTF-32
because these are not compatible with ASCII.
Haml只理解ASCII兼容编码
像UTF-8，但不是UTF-16或UTF-32
因为这些与ASCII不兼容。
Haml can be used in command line,
as a separate Ruby module,
or in a Ruby on Rails application
making Haml suitable for a wide range of applications.
Haml可以在命令行中使用，
作为一个独立的Ruby模块，
或者在Ruby on Rails应用程序中
使得Haml适用于广泛的应用。
It uses indentation to separate code blocks
and newline characters to separate rules.
它使用缩进来分隔代码块
和换行符来分隔规则。
The newer syntax,
"SCSS" (Sassy CSS),
uses block formatting like that of CSS.
更新的语法，
SCSS(Sassy CSS)，
使用像CSS那样的块格式。
It uses braces to denote code blocks
and semicolons to separate rules
within a block.
它使用大括号来表示代码块
和分号来分隔块中的规则。
The indented syntax and SCSS files
are traditionally given the extensions .sass and .scss,
respectively.
缩进语法和SCSS文件
传统上被赋予.sass和.scss扩展名，
分别是。
CSS3 consists of a series ofselectors and pseudo-selectors
that group rules that apply to them.
CSS3由一系列选择器和伪选择器组成，
它们对应用于它们的规则进行分组。
Sass
(in the larger context of both syntaxes)
extends CSS
by providing several mechanisms available
in more traditional programming languages,
particularly object-oriented languages,
but that are not available to CSS3 itself.
Sass(在两种语法的大环境中)
扩展了CSS，
提供了几种在更传统的编程语言中可用的机制，
特别是面向对象的语言，
但是CSS3本身不可用。
When SassScript is interpreted,
it creates blocks of CSS rules
for various selectors
as defined by the Sass file.
当解释SassScript时，
它为Sass文件定义的各种选择器
创建CSS规则块。
The Sass interpreter translates SassScript into CSS.
Sass解释器将SassScript翻译成CSS。
Alternatively,
Sass can monitor the .sass or .scss file
and translate it to an output .css file
whenever the .sass or .scss file is saved.
或者，
Sass可以监控.sass或.scss文件
并将其转换为输出为.css文件
每当.sass或.scss文件已保存的时候。
The indented syntax is a metalanguage.
缩进语法是一种元语言。
SCSS is a nested metalanguage,
as valid CSS is valid SCSS with the same semantics.
SCSS是一种嵌套的元语言，
正如有效的CSS是具有相同语义的有效的SCSS。
SassScript provides the following mechanisms:
variables,
nesting,
mixins,
and selector inheritance.
SassScript提供了以下机制:
变量、嵌套、混合和选择器继承。
Designed by
Hampton Catlin
Developer
Natalie Weizenbaum,
Chris Eppstein
First appeared
November 28, 2006;
14 years ago
Stable release
3.5.6 / March 23, 2018;
3 years ago
Typing discipline
Dynamic
OS
Cross-platform
License
MIT License
Filename extensions .sass, .scss
Website
sass-lang.com
Major implementations
Dart,
Ruby
Influenced by
CSS (both "indented" and SCSS)
YAML and Haml (indented syntax)
Less (SCSS)
Influenced
Less,
Stylus,
Tritium,
Bootstrap (v4+)
History
Sass was initially designed by Hampton Catlin
and developed by Natalie Weizenbaum.
Sass最初由汉普顿·卡特林设计，娜塔莉·韦森鲍姆开发。
After its initial versions,Weizenbaum and Chris Eppstein
have continued to extend Sass with SassScript,
a scripting language used in Sass files.
在最初的版本之后，
Weizenbaum和Chris Eppstein继续用SassScript扩展Sass，
一种用于Sass文件的脚本语言。
Major implementations
SassScript was implemented in multiple languages,
the noteworthy implementations are:
SassScript以多种语言实现，值得注意的实现有:
The original open-source Ruby implementation
created in 2006,
since deprecated due to the lack of maintainers
and reached End-of-Life in March 2019.
最初的开源Ruby实现创建于2006年，
由于缺乏维护人员而被弃用，
并于2019年3月达到生命的尽头。
The official open-source Dart implementation.
官方开源Dart实现。
libSass, the official open-source C++ implementation.
libSass，官方开源C++实现。
the official JavaScript implementation,
published as "sass" module on npm.
正式的JavaScript实现，作为npm上的“sass”模块发布。
JSass, an unofficial Java implementation.
JSass，一个非官方的Java实现。
phamlp, an unofficial SASS/SCSS implementation in PHP.
phamlp，PHP中非官方的SASS/SCSS实现。
Vaadin has a Java implementation of Sass.
Vaadin有一个Sass的Java实现。
Firebug,
a Firefox XUL ("legacy") extension
for web development.
It has been since deprecated
in favor of developer tools
integrated into Firefox itself.
It stopped working
since Firefox 57 dropped support
for XUL extensions.
Firebug，火狐XUL(“传统”)网络开发扩展。
它已经被弃用，取而代之的是集成到Firefox本身的开发工具。
自从火狐57放弃对XUL扩展的支持后，
它就停止工作了。
Vaadin
(Finnish pronunciation: [ˈʋɑːdin])
is an open-source web application development platform
for Java.
Vaadin includes a set of Web Components,
a Java web framework,
and a set of tools
that enable developers
to implement
modern web graphical user interfaces (GUI)
using the Java programming language only
(instead of HTML and JavaScript),
TypeScript only,
or a combination of both.
Vaadin(芬兰语发音:[ˈʋɑːdin])是一个面向Java的
开源web应用程序开发平台。
Vaadin包括一组Web Components、
一个Java web框架和一组工具，
这些工具使开发人员能够
仅使用Java编程语言(而不是HTML和JavaScript)、
仅使用TypeScript
或两者的组合
来实现现代Web图形用户界面(GUI)。
Features
Variables
Sass allows variables to be defined.
Variables begin with a dollar sign ($).
Variable assignment is done with a colon (:).
Sass允许定义变量。
变量以美元符号($)开头。
变量赋值是用冒号(:)完成的。
SassScript supports four data types:
- Numbers (including units)
- Strings (with
quotesor without) - Colors (name, or names)
- Booleans
SassScript支持四种数据类型:
数字(包括单位)
字符串(带引号或不带引号)
颜色(名称)
布尔运算
Variables can be
arguments to or results from
one of several available functions.
变量可以是
几个可用函数之一的
参数或结果。
During translation,
the values of the variables
are inserted into
the output CSS document.
在翻译过程中，变量的值被插入到输出CSS文档中。
Nesting
CSS does support logical nesting,
but the code blocks themselves are not nested.
CSS确实支持逻辑嵌套，
但是代码块本身没有嵌套。
Sass allows the nested code to be inserted
within each other.
Sass允许嵌套代码相互插入。
More complicated types of nesting
including namespace nesting and parent references
are discussed in the Sass documentation.
Sass文档中讨论了更复杂的嵌套类型，
包括命名空间嵌套和父引用。
Loops
Sass allows for iterating over variables
using @for, @each and @while,
which can be used to apply different styles
to elements with similar classes or ids.
Sass允许使用@for、@each和@while对变量进行迭代，
这可用于对具有`相似类`或`id`的元素
应用不同的样式。
Arguments
参数
Mixins also support arguments
Mixins也支持参数
In combination
Selector inheritance
选择器继承
While CSS3 supports
the Document Object Model (DOM) hierarchy,
it does not allow selector inheritance.
虽然CSS3支持文档对象模型(DOM)层次结构，
但它不允许选择器继承。
In Sass,
inheritance is achieved
by inserting a line inside of a code block
that uses the @extend keyword
and references another selector.
在Sass中，
继承是通过
在一个代码块中插入一行，
这一行使用了@extend关键字，
表示引用另一个选择器
通过这种方式来实现的。
The extended selector's attributes
are applied to the calling selector.
继承选择器的属性应用于调用选择器。
Sass supports multiple inheritance.
Sass支持多重继承。
libSass
At the 2012 HTML5 Developer Conference,
Hampton Catlin,
the creator of Sass,
announced version 1.0 of libSass,
an open source C++ implementation of Sass
developed by Catlin, Aaron Leung,
and the engineering team at Moovweb.
在2012年HTML5开发者大会上，
Sass的创造者汉普顿·卡特林(Hampton Catlin)
宣布了libSass的1.0版本，
这是由卡特林、
梁艾伦(Aaron Leung)和Moovweb的工程团队
开发的Sass的开源C++实现。
Current Sass maintainer,Chris Eppstein,
has expressed intent to contribute as well.
目前的Sass维护者
Chris Eppstein
也表达了贡献的意愿。
According to Catlin,
libSass can be
"drop into anything
and it will have Sass in it...
You could drop it right into Firefox today
and build Firefox
and it will compile in there.
We wrote our own parser from scratch
to make sure that would be possible."
根据卡特林的说法，
libSass可以
“插入任何东西，它会包含Sass...
你可以把它直接放到火狐中，
然后构建火狐，
它会在那里编译。
我们从头开始编写自己的解析器，
以确保这是可能的。”
The design goals of libSass are:
libSass的设计目标是:
Performance
–
Developers have reported 10x speed up increases
over the Ruby implementation of Sass.
性能
–
开发人员报告说，
与Sass的Ruby实现相比，
速度提高了10倍。
Easier integration
–
libSass makes it easier to
integrate Sass into more software.
Before libSass,
tightly integrating Sass
into a language or software product
required bundling the entire Ruby interpreter.
By contrast,
libSass is a statically linkable library
with zero external dependencies
and C-like interface,
making it easy to wrap Sass
directly into other programming languages and tools.
For example,
open source libSass
bindings now exist
for Node, Go, and Ruby.
更容易集成
–
libSass使Sass更容易集成到更多的软件中。
在libSass之前，
将Sass紧密集成到语言或软件产品中
需要捆绑整个Ruby解释器。
相比之下，
libSass是一个静态链接库，
没有外部依赖和类似C的接口，
使得将Sass直接包装到其他编程语言和工具中变得容易。
例如，
开源libSass绑定现在存在于Node、Go和Ruby中。
Compatibility –
libSass's goal is full compatibility with
the official Ruby implementation of Sass.
This goal has been achieved on libsass 3.3.
兼容性——libSass的目标是与Sass的官方Ruby实现完全兼容。
这个目标已经在libsass 3.3上实现了。