SASS教程

SASS是什么?
SASS是一个CSS预处理器有助于减少重复利用CSS并节省时间。它是描述文档样式更干净,结构更加稳定和强大的CSS扩展语言。

历史

它最初是由Hampton Catlin设计,Natalie Weizenbaum在2006年开发。

为什么要使用SASS?

  • 这是前置处理语言,它为CSS提供缩进语法(它自己的语法)。
  • 它提供了用于创建,允许更高效地编写代码,并易于维护的样式表的某些功能。
  • 它是CSS的超集,这意味着它包含CSS的所有功能,是一个开放源代码的预处理器。
  • 它提供了比扁平CSS良好的结构格式文档样式。它使用可重复使用的方法,逻辑语句和一些内置在功能,如颜色操作,数学和参数列表。

特点

  • 它是使用CSS的版本兼容,更稳定,强大。
  • 它是CSS的超集以及基于JavaScript。
  • 它被称为CSS的语法修饰,这意味着它使用户阅读或表达的东西更清楚更简单。
  • 它使用自己的语法和编译成可读的CSS。
  • 您可以轻松地在更短的时间内编写CSS更少的代码。
  • 它是一个开源的预处理器,它被解释为CSS。

优势

  • 它允许写干净的CSS的编程结构。
  • 它有助于更快编写CSS。
  • 它是CSS的超集,它可以帮助设计人员和开发人员提高工作效率。
  • 由于 Sass 与所有的CSS版本兼容,我们可以使用任何可用的CSS库。
  • 也可以使用嵌套语法和有用的功能,如颜色操作,数学和其他值。

缺点

  • 这需要时间,开发人员要学会在这个预处理器目前的新功能。
  • 如果有更多多的人工作在同一个站点,然后将使用相同的预处理器。有人用Sass,而有人直接编辑CSS文件。因此,这将难以协同在网站上工作。
  • 还有失去浏览器内置检查器查看元素的好处。

猿狮妹
2022-12-05
SASS教程 编程课程
热门教程
1 SASS教程 SASS是一个CSS预处理器有助于减少重复利用CSS并节省时间。它是描述文档样式更干净,结构更加稳定和强大的CSS扩展语言。
2 Sass @debug指令 @debug指令检测错误,并显示SassScript表达值到标准错误输出流。 示例 下面是保存扩展为.scss,这类似于CSS文件的样式表文件。 debug.scss $font-sizes: 10px + 20px;$style: ( color: #bdc3c7);.container{ @
3 Sass引用父选择器 可以通过使用字符选择父选择器。它告诉应插入父选择器在哪里。 实例 下面的例子说明了在SCSS文件使用父选择器: htmlhead metahttp-equiv=”Content-Type”content=”text/html;charset=utf-8” title 引用父选
4 Sass语法 在本章我们学SASS语法。SASS支持两种语法,即SCSS和缩进语法。 SCSS(SassyCSS)是CSS语法的扩展。这意味着每一个有效的CSS也是一个有效的SCSS语句。SCSS使得更容易维护大型样式表和可识别
5 Sass嵌套规则 嵌套组合不同于逻辑结构。使用SASS,我们可以在彼此合并多个CSS规则。如果使用多个选择器,那么可以使用一个选择在另一个创建复合选择器。 实例 下面的例子描述了SCSS文件嵌套的规
6 Sass布尔运算符 可以通过使用与,或,非操作符来执行 Sass 脚本布尔运算。 示例 下面的例子演示了SCSS文件使用布尔操作: htmlhead metacharset=”UTF-8” titleBoolean操作 -www.vcclass.net/title link rel=”stylesheet” type=”
7 Sass数字运算符 SASS允许数学运算,如加,减,乘和除。可以使用不兼容的单位,比如px*px或同时加入一些与PX和EM导致产生无效的CSS。所以,如果在CSS中使用无效的单位,SASS将显示错误。SASS支持关系运
8 Sass交互式shell SassScript通过使用交互式shell工作。可以使用-i选项运行shell及sass命令行。 语法 $ sass - i 下面我们将使用上面的命令编写一些表达式,如下图所示: 正如在上面的图片中看到,我们已经通
9 Sass安装 本文提供安装Ruby过程说明,它用于执行SASS文件。 SASS系统要求 操作系统 : 跨平台 浏览器支持 : IE (IE 8+), Firefox, Google Chrome, Safari, Opera 编程语言: Ruby Ruby的安装 Step(1): 如果使用的是Linu
10 Sass的使用 SASS更强大和更稳定,可提供强大基本语言使用来扩展CSS。可以以三种不同的方式使用SASS: 作为一个命令行工具 作为一个Ruby模块 作为一个插件机架启用框架 如果您在Windows上使用SASS,
  • Copyright © 2021 猿狮院, All rights reserved.