SASS更强大和更稳定,可提供强大基本语言使用来扩展CSS。可以以三种不同的方式使用SASS:
-
作为一个命令行工具
-
作为一个Ruby模块
-
作为一个插件机架启用框架
如果您在Windows上使用SASS,那么需要先安装Ruby。有关安装Ruby的更多信息,参考SASS安装 章节。
下表显示了用于执行SASS代码的命令:
S.N. |
命令和说明
|
---|---|
1 |
sass input.scss output.css
用来运行命令行SASS代码
|
2 |
sass --watch input.scss:output.css
它通知SASS监视文件,每当SASS文件更改时更新CSS
|
3 |
sass --watch app/sass:public/stylesheets
它用于监视整个目录,如果SASS包含在目录中许多文件
|
Rack/Rails/Merb插件
机架(Rack)是用于开发Web应用程序在Ruby中的Web服务器界面。有关机架的信息,访问该链接:这里 。
在Rails3版本可以使用config文件夹environment.rb文件。启用Rails的3SASS使用下面命令行:
config.gem "sass"
您可以使用以下行为Rails 3的Gemfile(及以上版本),如:
gem "sass"
Rails是使用Web标准,如用于的JSON,HTML,CSS和JavaScript到用户界面的一个开源Web框架。要使用Rails来工作,需要有Ruby的基本知识和面向对象编程。
如果要启用机架应用SASS,添加以下行到config.ru文件,该文件存在于应用程序的根目录下:
require 'sass/plugin/rack' use Sass::Plugin::Rack
Merb是一个Web应用程序框架,它提供速度和模块化到Rails。
可以通过添加下面一行到 config/dependencies.rb 文件中,使 SASS 在 Merb 中启用:
dependency "merb-haml"
缓存
SASS缓存文件,如模板和泛音可以在不分析它们,除非它们已更改被重用。当模板被分成全都导入到一个大文件单独的文件这使得SASS文件编译更快,工作得甚至更好。如果删除缓存文件,它们下一次生成时将被重新编译。
选项
可以使用以下行在 environment.rb 或文件 config.ru 文件设置的 RailsRack 应用的选项:
Sass::Plugin.options[:style] = :compact
还可以通过使用下面一行设置Merb的init.rb文件选项:
Merb::Plugin.config[:sass][:style] = :compact
有在如下表所述可用SASS和SCSS一些选项:
S.N. |
选项和说明
|
---|---|
1 |
:style
显示输出的样式
|
2 |
:syntax
可以使用缩进语法SASS和CSS扩展语法
|
3 |
:property_syntax
属性使用缩进语法。如果它不正确,那么就会抛出一个错误。例如,考虑“background: #F5F5F5”,这里是一个属性名是background,而#F5F5F5是它的属性值。在属性名后,必须使用冒号。
|
4 |
:cache
加快了SASS文件的编译。它默认设置为true
|
5 |
:read_cache
只读SASS文件,如果缓存中没有设置和 read_cache 设置
|
6 |
:cache_store
可以被用来存储和通过将其设置到 Sass::CacheStores::Base 实例相应访问高速缓存的结果
|
7 |
:never_update
不应该更新CSS文件,如果模板文件的变化。默认情况下它设置为 false
|
8 |
:always_update
每当模板文件有变化它会更新CSS文件
|
9 |
:always_check
应检查每当服务器启动更新。它将重新编译并覆盖 CSS 文件,如果在 SASS 模板文件的更新
|
10 |
:poll
采用后端Sass::Plugin::Compiler#watch(模板和CSS文件更新)将其设置为true。
|
11 |
:full_exception
显示每当一个例外SASS代码生成 CSS 文件的错误描述。它显示发生源代码 CSS 文件的错误行号
|
12 |
:template_location
提供了应用程序的模板目录的路径
|
13 |
:css_location
提供了在应用程序中的CSS样式表的路径
|
14 |
:unix_newlines
通过将其设置为 true,写入文件时提供 Unix 样式的换行符
|
15 |
:filename
正在显示和用于报告错误的文件名的名称
|
16 |
:line
指定SASS模板的第一线和显示错误的行号
|
17 |
:load_paths
使用@import加载被包括指令的路径SASS模板
|
18 |
:filesystem_importer
它是用来导入从Sass::Importers::Basesub类来处理字符串加载路径文件系统中的文件
|
19 |
:sourcemap
产生指示浏览器找到SASS样式源代码映射。它使用三个值:
|
20 |
:line_numbers
显示了通过将其设置为true来报告在CSS文件中的错误行号
|
21 |
:trace_selectors
当它被设置为true,它有助于追踪导入和混入选择器
|
22 |
:debug_info
它提供SASS文件的使用的行号和文件当它的调试信息被设置为true
|
23 |
:custom
在不同的应用程序提供数据给SASS函数
|
24 |
:quiet
通过将其设置为true,禁用警告
|
语法选择
您可以决定SASS模板,所使用的语法是使用SASS命令行工具。通过默认SASS使用缩进语法,这是一种替代基于SCSS的CSS语法。可以使用SCSS命令行程序,它类似于SASS程序,但默认情况下使用SCSS语法。
编码
SASS使用样式表的字符编码通过指定以下CSS规范:
-
首先,它会检查Unicode字节,接下来@charset声明,再进行Ruby字符串编码
-
接下来如果没有设置,则认为字符编码为UTF-8
-
通过使用@charset声明明确字符编码。只要使用“@charset编码名称”的样式表开磁,SASS将认为这是按给定字符编码。
-
如果SASS输出文件中包含非ASCII字符,那么它将使用@charset 声明。