一、sass和scss

sass最初是为了配合haml设计的,不需要大括号,用tab缩进

从第三代开始,保留缩进风格,完全向下兼容普通的css代码

二、下载配置sass

compass是sass的一个工具库

安装compass和sass都需要Ruby

1.下载Ruby

2.安装

3.安装compass和sass

4.在vscode安装自动变异sass文件的插件→Esay Sass

在插件的json中配置如下

    "easysass.compileAfterSave": true,
"easysass.formats": [ //nested:嵌套缩进的 css 代码。
//expanded:没有缩进的、扩展的css代码。
//compact:简洁格式的 css 代码。
//compressed:压缩后的 css 代码
{
"format": "compressed:压缩后的",
"extension": ".css"
},
{
"format": "compressed",
"extension": ".min.css"
}
],
"easysass.targetDir": "./" //表示当前路径

三、sass语法

1.sass转为css的类型

09-sass的更多相关文章

  1. Ionic3 遇到的一些错误-submodule update -q --init --recursive

    解决方法: ionic start myTabs tabs --skip-deps cd .\myTabs cnpm install --save-dev ionic serve > npm i ...

  2. Windows7WithSP1/TeamFoundationServer2012update4/SQLServer2012

    [Info   @09:03:33.737] ====================================================================[Info   @ ...

  3. Sublime插件支持Sass编译和Babel解析ES6 & .sublime-build文件初探

    用Sublime Text蛮久了,配置配来配去的,每次换电脑都得重头再配过,奈何人老了脑子不中用了,得好好整理一些,下次换电脑就有得参考了.. 同事说,他的WebStorm简直太方便,自身集成了很多方 ...

  4. Sass的基本运算(转载)

    转载于:http://www.cnblogs.com/Medeor/p/4966952.html Sass中的基本运算 一.加法 在 CSS 中能做运算的,到目前为止仅有 calc() 函数可行.但在 ...

  5. Sass运算

    加法在 CSS 中能做运算的,到目前为止仅有 calc() 函数可行.在 Sass 中,运算只是其基本特性之一.在 Sass 中可以做各种数学计算.加法运算是 Sass 中运算中的一种,在变量或属性中 ...

  6. Sass入门:第四章

    1.加法 加法运算是Sass中运算的一种,在变量或属性中都可以做加法运算.如: .box { width: 20px + 8in; } 编译出来的CSS: .box { width: 788px; } ...

  7. Brackets + Sass 学习心得

    大家知道Brackets是一个可以实时浏览html页面修改效果的工具,对于前段开发人员应该不会陌生,有了它,布局页面再也不是什么困难了, 目前为止已经更新到1.6了. 下载最新版可以到官方网: htt ...

  8. Sass控制命令及函数知识整理

    2017-07-07  20:17:17 最底部附结构图(实在是结构图太长了没办法) 2017-06-22  09:11:43 一.Sass的控制命令 1.@if语句 @if 指令是一个 SassSc ...

  9. 菜鸟的 Sass 学习笔记

    介绍 sass 是什么?? 在sass的官网,它是这么形容给自己的 Sass is the most mature, stable, and powerful professional grade C ...

  10. sublimeText3 中配置sass环境,并将编译后文件保存到指定文件夹

    sass基于ruby引擎,所以安装时ass.compass之前需要安装ruby.具体的链接应该是(http://rubyinstaller.org/downloads).下载并安装相应的版本,勾选第二 ...

随机推荐

  1. spring的ioc依赖注入的三种方法(xml方式)

    常见的依赖注入方法有三种:构造函数注入.set方法注入.使用P名称空间注入数据.另外说明下注入集合属性 先来说下最常用的那个注入方法吧. 一.set方法注入 顾名思义,就是在类中提供需要注入成员的 s ...

  2. 解决2020-3-27 github无法访问

    早上的github无法访问了 查找资料后,发现可以修改 hosts 文件 右键 属性 将只读去掉 进行修改 其中的ip去如下地址拿 试一下,大功告成

  3. 各种WAF绕过手法学习

    原文:https://mp.weixin.qq.com/s/aeRi1lRnKcs_N2JLcZZ0Gg 0X00    Fuzz/爆破 fuzz字典 1.Seclists/Fuzzing https ...

  4. Java BIO、NIO与AIO的介绍(学习过程)

    Java BIO.NIO与AIO的介绍 因为netty是一个NIO的框架,所以在学习netty的过程中,开始之前.针对于BIO,NIO,AIO进行一个完整的学习. 学习资源分享: Netty学习:ht ...

  5. jquery实现元素的显示和隐藏

    这个是指定表格列的隐藏的demo,其余的都大同小异了 $("#account-table tr").find($("#tcNum")).show();//sho ...

  6. ubuntu初始化root密码

    输入 sudo passwd root 输入两遍密码.

  7. sql-lib闯关41-50

    第四十一关 这关和第三十九关一样,只是错误没有回显 获得版本和数据库名   ?id=0 union select 1,version(),database() %23 获得表名    ?id=0 un ...

  8. MySQL datetime类型详解

    研发反馈问题,数据库中datetime数据类型存储的值末尾会因四舍五入出现不一致数据,影响查询结果,比如:程序中自动获取带毫秒精度的日期'2019-03-05 01:53:55.63',存入数据库后变 ...

  9. 使用TensorFlow v2.0构建多层感知器

    使用TensorFlow v2.0构建一个两层隐藏层完全连接的神经网络(多层感知器). 这个例子使用低级方法来更好地理解构建神经网络和训练过程背后的所有机制. 神经网络概述 MNIST 数据集概述 此 ...

  10. Python函数之面向过程编程

    一.解释 面向过程:核心是过程二字,过程即解决问题的步骤,基于面向过程去设计程序就像是在设计,流水线式的编程思想,在设计程序时,需要把整个流程设计出来, 一条工业流水线,是一种机械式的思维方式 二.优 ...