📝 Sass教程

91篇技术文档
  Sass教程

📅  最后修改于: 2020-10-20 05:38:08        🧑  作者: Mango

SASS(语法上很棒的样式表)是CSS预处理器,有助于减少CSS的重复并节省时间。它是更稳定,功能更强大的CSS扩展语言,可以从结构上描述文档的样式。本教程介绍了SASS的基础。听众本教程将为想要使自己的网站或个人博客更具吸引力的学生和专业人士提供帮助。先决条件在继续本教程之前,我们假设您知道-使用任何文本编辑器的基本文字处理。如何创建目录和文件。如何浏览不同的目录。使用流行的浏览器(例如Inte...

  Sass-概述

📅  最后修改于: 2020-10-20 05:38:27        🧑  作者: Mango

什么是SASS?SASS(语法上很棒的样式表)是CSS预处理器,有助于减少CSS的重复并节省时间。它是更稳定,功能更强大的CSS扩展语言,可以清晰,结构化地描述文档的样式。它最初由Hampton Catlin设计,由Natalie Weizenbaum于2006年开发。后来,Weizenbaum和Chris Eppstein使用其初始版本通过SassScript扩展了Sass。为什么要使用SASS...

  Sass-安装

📅  最后修改于: 2020-10-20 05:38:52        🧑  作者: Mango

在本章中,我们将逐步学习安装Ruby的过程,该过程用于执行SASS文件。SASS的系统要求操作系统-跨平台浏览器支持-IE(Internet Explorer 8 +),Firefox,Google Chrome,Safari,Opera编程语言-Ruby安装Ruby步骤1-打开链接https://www.ruby-lang.org/en/downloads/,您将看到如下所示的屏幕-下载zip文...

  Sass-语法

📅  最后修改于: 2020-10-20 05:39:25        🧑  作者: Mango

在本章中,我们将研究SASS语法。 SASS支持两种语法,即SCSS和缩进语法。SCSS(Sassy CSS)是CSS语法的扩展。这意味着每个有效的CSS也是有效的SCSS。 SCSS使维护大型样式表变得更加容易,并且可以识别特定于供应商的语法。许多CSS和SCSS文件使用扩展名.scss。缩进-这是较旧的语法,有时也称为SASS。使用这种形式的语法,可以简洁地编写CSS。 SASS文件使用扩展名...

  使用Sass

📅  最后修改于: 2020-10-20 05:40:07        🧑  作者: Mango

SASS更加强大和稳定,它通过使用CSS扩展为基本语言提供了强大的功能。您可以通过三种不同的方式使用SASS-作为命令行工具作为Ruby模块作为Rack enable Framework的插件如果在Windows上使用SASS,则需要先安装Ruby。有关安装Ruby的更多信息,请参阅SASS安装一章。下表显示了用于执行SASS代码的命令-S. No.Command & Description1sa...

  Sass-CSS扩展

📅  最后修改于: 2020-10-20 05:40:21        🧑  作者: Mango

在本章中,我们将研究CSS扩展。 CSS扩展可以用来增强网页的功能。下表列出了SASS中使用的一些CSS扩展-S. No.CSS Extension & Description1Nested RulesIt is a way of combining multiple CSS rules within one another.2Referencing Parent Selectors: &It i...

  Sass-评论

📅  最后修改于: 2020-10-20 05:40:46        🧑  作者: Mango

在本章中,我们将研究有关Sass评论。注释是不可执行的语句,放置在源代码中。注释使源代码更易于理解。 SASS支持两种类型的注释。多行注释-这些注释使用/ *和* /编写。多行注释保留在CSS输出中。单行注释-这些注释使用//编写,后跟注释。单行注释不会保留在CSS输出中。例以下示例演示了SCSS文件中注释的使用-接下来,创建文件style.scss。style.scss您可以使用以下命令,让SA...

  Sass-@-规则和指令

📅  最后修改于: 2020-10-20 05:44:36        🧑  作者: Mango

下表列出了可以在SASS中使用的所有规则和指令。S. No.Directives & Description1@importIt imports the SASS or SCSS files, it directly takes the filename to import.2@mediaIt sets the style rule to different media types.3@exten...

  Sass-控制指令和表达式

📅  最后修改于: 2020-10-20 05:45:00        🧑  作者: Mango

在本章中,我们将研究控制指令和表达式。可以通过使用SassScript支持的控制指令和表达式来完成基于某些条件的样式设置或多次使用相同样式的变体。这些控制指令是主要用于mixin的高级选项。它们是Compass库的一部分,因此需要相当大的灵活性。下表列出了SASS中使用的控制指令和表达式-S. No.Control Directive & Expression with Description1i...

  Sass-Mixin指令

📅  最后修改于: 2020-10-20 05:45:16        🧑  作者: Mango

Mixins允许创建一组样式,这些样式可在整个样式表中重复使用,而无需重新创建非语义类。在CSS中,mixins可以存储多个值或参数并调用函数;它有助于避免编写重复的代码。 Mixin名称可以互换使用下划线和连字符。以下是Mixins中存在的指令-S. No.Directive & Description1Defining a Mixin@mixindirective is used to def...

  Sass-功能指令

📅  最后修改于: 2020-10-20 05:45:40        🧑  作者: Mango

在本章中,我们将研究功能指令。在SASS中,您可以创建自己的函数并在脚本上下文中使用它们,也可以将其与任何值一起使用。通过使用函数名称和任何参数来调用函数。例以下示例演示了SCSS文件中函数指令的使用-function_directive.htm接下来,创建文件style.scss。style.scss您可以使用以下命令,让SASS监视文件并在SASS文件更改时更新CSS-接下来,执行以上命令;它...

  Sass-输出样式

📅  最后修改于: 2020-10-20 05:46:02        🧑  作者: Mango

在本章中,我们将研究SASS输出样式。 SASS生成的CSS文件由默认CSS样式组成,该样式反映了文档的结构。默认的CSS样式不错,但可能不适用于所有情况。另一方面,SASS支持许多其他样式。它支持以下不同的输出样式-:嵌套嵌套样式是SASS的默认样式。处理大型CSS文件时,这种样式方式非常有用。它使文件的结构更具可读性,并且易于理解。每个属性都有自己的界限,每个规则的缩进基于其嵌套的深度。例如,...

  扩展Sass

📅  最后修改于: 2020-10-20 05:46:24        🧑  作者: Mango

您可以扩展SASS的功能以为用户提供不同类型的功能和自定义。要使用这些功能,用户应该具有Ruby的知识。定义自定义SASS功能您可以在使用Ruby API时定义自己的SASS函数。您可以通过将自定义函数添加到Ruby方法中来添加自定义函数,如以下代码所示-在代码中,你可以看到,函数,声明,指定函数的参数名称。如果失败,则即使该函数正在运行,它也将不接受任何参数,并且它也接受任意关键字参数。您可以使...

  萨斯-面试问题

📅  最后修改于: 2020-10-20 05:47:52        🧑  作者: Mango

亲爱的读者,这些SASS面试题是专门为让您熟悉在SASS主题的面试过程中可能遇到的问题的性质而设计的。根据我的经验,优秀的面试官几乎不会计划在面试过程中提出任何特定的问题,通常,问题是从该主题的一些基本概念开始的,然后根据进一步的讨论和您的回答继续进行讨论-什么是SASS?SASS(语法上很棒的样式表)是CSS预处理程序,有助于减少CSS的重复并节省时间。它是一种更稳定,功能更强大的CSS扩展语言...

  Sass-有用的资源

📅  最后修改于: 2020-10-20 05:48:12        🧑  作者: Mango

以下资源包含有关Sass的其他信息。请使用它们来获得有关该主题的更深入的知识。Sass上的有用链接Sass Wiki–Sass的维基百科参考。关于Sass的有用书籍要在此页面上注册您的网站,请发送电子邮件至...