09-sass
一、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的更多相关文章
- Ionic3 遇到的一些错误-submodule update -q --init --recursive
解决方法: ionic start myTabs tabs --skip-deps cd .\myTabs cnpm install --save-dev ionic serve > npm i ...
- Windows7WithSP1/TeamFoundationServer2012update4/SQLServer2012
[Info @09:03:33.737] ====================================================================[Info @ ...
- Sublime插件支持Sass编译和Babel解析ES6 & .sublime-build文件初探
用Sublime Text蛮久了,配置配来配去的,每次换电脑都得重头再配过,奈何人老了脑子不中用了,得好好整理一些,下次换电脑就有得参考了.. 同事说,他的WebStorm简直太方便,自身集成了很多方 ...
- Sass的基本运算(转载)
转载于:http://www.cnblogs.com/Medeor/p/4966952.html Sass中的基本运算 一.加法 在 CSS 中能做运算的,到目前为止仅有 calc() 函数可行.但在 ...
- Sass运算
加法在 CSS 中能做运算的,到目前为止仅有 calc() 函数可行.在 Sass 中,运算只是其基本特性之一.在 Sass 中可以做各种数学计算.加法运算是 Sass 中运算中的一种,在变量或属性中 ...
- Sass入门:第四章
1.加法 加法运算是Sass中运算的一种,在变量或属性中都可以做加法运算.如: .box { width: 20px + 8in; } 编译出来的CSS: .box { width: 788px; } ...
- Brackets + Sass 学习心得
大家知道Brackets是一个可以实时浏览html页面修改效果的工具,对于前段开发人员应该不会陌生,有了它,布局页面再也不是什么困难了, 目前为止已经更新到1.6了. 下载最新版可以到官方网: htt ...
- Sass控制命令及函数知识整理
2017-07-07 20:17:17 最底部附结构图(实在是结构图太长了没办法) 2017-06-22 09:11:43 一.Sass的控制命令 1.@if语句 @if 指令是一个 SassSc ...
- 菜鸟的 Sass 学习笔记
介绍 sass 是什么?? 在sass的官网,它是这么形容给自己的 Sass is the most mature, stable, and powerful professional grade C ...
- sublimeText3 中配置sass环境,并将编译后文件保存到指定文件夹
sass基于ruby引擎,所以安装时ass.compass之前需要安装ruby.具体的链接应该是(http://rubyinstaller.org/downloads).下载并安装相应的版本,勾选第二 ...
随机推荐
- 图数据库 Nebula Graph TTL 特性
导读 身处在现在这个大数据时代,我们处理的数据量需以 TB.PB, 甚至 EB 来计算,怎么处理庞大的数据集是从事数据库领域人员的共同问题.解决这个问题的核心在于,数据库中存储的数据是否都是有效的.有 ...
- Android开发:通过 webview 将网页打包成安卓应用
商业转载请联系作者获得授权,非商业转载请注明出处. For commercial use, please contact the author for authorization. For non-c ...
- JDK环境的配置,及运用
JAVA为什么可以跨平台 1.JDK配置环境变量 步骤:打开控制面板中系统和安全------系统-----找到高级系统设置点击属性------高级----环境变量------系统变量(JAVA_HOM ...
- Happens-before先行发生原则
简介 从JDK1.5,java使用新的JSR-133内存模型:JSR-133使用happens-before的概念来阐述操作之间的内存可见性:在JMM中,如果一个操作执行的结果需要对另一个操作可见,那 ...
- Angular2入门(一)
原先用vue.js写的项目,最近领导要求改用Angular,于是开始自学之路.网上搜索了众多资料,包括谷歌原版书籍,但是Angular自从17年开始分为AngularJs和Angular两个版本,相差 ...
- Oracle设置和修改system和scott的口令,并且如何连接到system和scott模式下
1.在Oracle数据库中,有个示例模式scott和系统模式system. 2.在安装数据库时只是设置了system的口令,即密码,如果忘记的话可以使用如下办法,首先打开sqlplus工具或者cmd命 ...
- 洛谷 P3909 异或之积 题解
原题链接 本人看了其它解法,发现本人的解法还是 首创 ! 而且我的解法好像和 \(\times 6\) 没什么关系 -- (如果没 \(\times 6\),我没还不用算逆元) 别人的思路呢,大都是从 ...
- 贪心-谷歌-857. 雇佣 K 名工人的最低成本
2020-03-15 22:00:39 问题描述: 有 N 名工人. 第 i 名工人的工作质量为 quality[i] ,其最低期望工资为 wage[i] . 现在我们想雇佣 K 名工人组成一个工资组 ...
- 主从校验工具pt-table-checksum和pt-table-sync工作原理
pt-table-checksum和pt-table-sync是常用来做MySQL主从数据一致性校验的工具,pt-table-checksum只校验数据,不能对数据进行同步:pt-table-sync ...
- 了解1D和3D卷积神经网络 | Keras
当我们说卷积神经网络(CNN)时,通常是指用于图像分类的2维CNN.但是,现实世界中还使用了其他两种类型的卷积神经网络,即1维CNN和3维CNN.在本指南中,我们将介绍1D和3D CNN及其在现实世界 ...