SASS面试题及答案 - [ Web技术面试题及答案 ]

SASS表示Syntactically Awesome Style Sheets。 它是一个CSS预处理器,用于减少CSS的重复并节省时间。通过阅读下面SASS面试题和答案,有助于让您在面试过程中应付自如,也可作为测评或复习巩固SASS知识。

1. SASS是什么?

SASS表示Syntactically Awesome Style Sheet。 它是一个CSS预处理器,用于减少CSS的重复并节省时间。 它为基本语言增添了强大功能和优雅,便于您添加变量,嵌套规则,混合,内联导入,继承等,所有这些都与CSS兼容的语法完全相同。 详细答案>>

2. SASS的创始人是谁?

SASS的创始人是:Hampton Catlin。

详细答案>>

3. 为什么需要使用SASS(原因)?

以下是使用SASS一些重要原因。 可以轻松高效地编写代码,并且易于维护。它是一种预处理语言,为CSS提供语法。它是CSS的超集,它包含CSS的所有功能,是一个用Ruby编码的开源预处理器。它更稳定,更强大的CSS扩展和样式文档更清晰,更结构。它有利于可重用性方法,逻辑语句和一些内置函数,如颜色操作,数学和参数列表项。详细答案>>

4. 有多少种方法可以使用SASS?

我们可以通过三种不同的方式使用SASS:

  • 通过命令行工具。
  • 通过独立的Ruby模块。
  • 通过任何支持Rack的框架的插件。
详细答案>>

5. SASS最吸引人的特点是什么?

SASS最吸引人的特点是: 它更稳定,功能强大,与CSS3完全兼容。它节省时间,因为它可以使用更少的代码编写CSS。它使用它的语法。它基于CSS的JavaScript和超集。它是一个开源预处理器,可以解释为CSS。它包含用于处理颜色和其他值的各种函数。它具有针对库的高级控制指令。它提供格式良好,可自定义的输出。详细答案>>

6. Sass脚本支持哪些数据类型?

Sass脚本支持以下数据类型: 布尔值(true或false)数字(1,5,13,10px)空值颜色(red,#FF0000)文字字符串,没有引号(“foo”,“bar”)以逗号或空格分隔的值列表(2.0em,Verdana,Arial,Helvetica)从一个值映射到另一个值(key1:value1,key2:value2)函数引用。 SASS始终支持所有其他类型的CSS属性值,例如Unicode范围,特殊字符和不带引号的字符串。详细答案>>

7. 哪个变量用于定义SASS?

变量以美元($)符号开头,变量的赋值以分号(;)符号结束。

详细答案>>

8. 解释SCSS和Sass之间的区别?

SCSS和Sass之间的主要区别如下: Sass就像一个CSS预处理器。 它具有CSS3的扩展。 Sass来自另一个称为Haml的预处理器。Sass包含两种语法: “SCSS”是第一种语法,它使用.scss的扩展名。缩进语法或“Sass”是另一种语法,它使用.sass的扩展名。 只需将扩展名从.CSS更改为.SCSS,即可将有效的CSS文档转换为Sass。 它完全兼容CSS。 SCSS提供了CSS友好的语法来缩小Sass和CSS之间的差距。 SCSS称为Sassy CSS。详细答案>>

9. 解释使用Sass @import函数?

它用于扩展CSS导入规则。 为此需要启用Sass和SCSS文件的导入。它可以将所有导入的文件合并为一个输出的CSS文件。它用于虚拟匹配和混合任何文件。它需要一个文件名来导入功能。它比平面CSS更好地提供文档样式表示。它可以保持响应式设计项目更有条理。详细答案>>

10. Sass有什么优势/优点?

Sass有什么优势 - 节省时间。更高效,更快捷。兼容所有版本的CSS。可以使用嵌套语法和有用的函数,如颜色操作,数学和其他值。在编程结构中编写干净的CSS它是CSS的超级集合,使用嵌套和其他值。详细答案>>

11. Sass中的嵌套规则是什么?

嵌套是一种将多个逻辑结构相互组合的方法。 在Sass中,各种CSS规则相互连接。
例如,如果使用多个选择器,则可以在另一个选择器中使用一个选择器来创建复合选择器。

详细答案>>

12. 哪一个更好,Sass还是Less?

由于以下原因,Sass胜过Less: Sass提供了使用循环,条件等逻辑语句的工具,还可以帮助您编写可重用的方法。Sass的用户可以访问公司的库。Sass用户还可以使用一些非常棒的功能,如跨浏览器支持,遗留浏览器黑客和动态精灵地图生成。Compass还提供了添加外部框架(如Bootstrap)的工具,Blueprint。Sass提供编写便捷功能的工具。详细答案>>

13. 在Sass中编写占位符选择器的方法是什么?

在Sass中,占位符选择器可以与类或id选择器一起使用。 在标准CSS中,这些是用#或.指定的,但在SASS中它们被替换为“%”。 它使用@extend指令在CSS中显示结果。 例如: .para1 { color: blue; } .para2 { @extend .para1; font-size:30px; } 详细答案>>

14. Sass的数字操作是什么?

在Sass中,数字运算用于数学运算,如加法,减法,乘法和除法。 Sass数字操作将执行像取像素值并将其转换为百分比而没有太多麻烦。

详细答案>>

15. Sass的色彩操作是什么?

在Sass中,颜色操作允许使用颜色在Sass中,颜色操作允许使用颜色分量以及算术运算。

详细答案>>

16. 如何在Sass中执行布尔运算?

可以使用and,而不是运算符对Sass脚本执行布尔运算。

详细答案>>

17. Sass中括号运算是什么?

括号用于提供影响操作顺序的符号逻辑。 它是一对标志,通常用圆形()括号或方括号[]括号标记。

详细答案>>

18. 如何使用Sass Mixin功能?

Mixin函数用于定义样式。 函数和Mixins非常相似。可以在整个样式表中重复使用此样式。 要重用它,不需要使用像.float-left这样的非语义类。 Mixin可以存储多个值或参数,并调用函数以避免编写重复代码。 它的名称可以互换使用下划线和连字符。详细答案>>

19. 在Sass中Mixin功能有什么用?

DDRY输出Mixin功能分为两部分:静态部分和动态部分。

静态Mixin包含否则将被复制的信息片段,动态Mixin是用户要调用的函数。

详细答案>>

20. 描述Sass注释和常规CS注释之间的区别?

常规CSS中的注释以/* */开头,而Sass包含两个命令。 带//的单行注释和带/* */的多个CSS注释。

详细答案>>

21. 哪个指令用于检测SASS中的错误?

Sass @debug指令用于检测错误并将Sass脚本表达式值显示到标准错误输出流。 例如: $font-sizes: 10px + 20px; $style: ( color: #bdc3c7 ); .container{ @debug $style; @debug $font-sizes; } 详细答案>>

22. SASS系统有哪些要求?

这些是Sass系统的要求:

.Operating System - Cross platform  
.Browser support - Internet Explorer, Google Chrome, Safari, Opera.  
.Programming language - Ruby.
详细答案>>

23. 在SASS中使用@extend指令有什么用?

SASS @extend指令用于从一个选择器到另一个选择器共享一组CSS属性。 这是Sass非常重要和有用的功能。 它允许类彼此共享一组属性。 它使代码更少,并帮助您重复重写它。 例如: .message border: 1px solid #ccc padding: 10px color: #333 .success @extend .message border-color: green .error @ext...详细答案>>

24. @media指令在SASS中的作用是什么?

Sass @media指令用于将样式规则设置为不同的媒体类型。 它支持并扩展了@media规则。 该指令可以嵌套在选择器SASS中,但主要影响显示在样式表的顶层。 例如: h2{ color: violet; } .style{ width: 500px; @media screen and (orientation: portrait){ width:200px; margin-left: 80px; } } 详细答案>>

25. 在SASS中at-root指令有什么用?

Sass @at-root指令是嵌套规则的集合,用于在文档的根目录中设置块样式。 例如: h2{ color: blue; background-color: pink; @at-root { .style{ font-size: 20px; font-style: bold; color: violet; } } } 详细答案>>
注: 此试题仅作为相关知识水平测试,不能作为权威试题和答案。非商业转载注明原文链接即可;商业转载需本站授权同意。