SASS:

http://www.sass.hk/sass-course.html   SASS  2015-10-10

http://sass.bootcss.com/docs/sass-reference/   Sass参考手册  2015-10-11

http://www.ruanyifeng.com/blog/2012/06/sass.html   阮一峰的SASS用法指南

sass文件后缀:1.scss

@charset "UTF-8";//这一句一定要写,否则utf8编码的文件,如果包含中文的,编译会出错
@mixin radius5 {//圆角
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.note1 {
background-color: green;
@include radius5;
}

cmd输入命令:sass 1.scss 1.css,编译结果如下:

.note1 {
background-color: green;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px; } /*# sourceMappingURL=1.css.map */

Sass的安装:

http://rubyinstaller.org/downloads   官网下载  http://dl.bintray.com/oneclick/rubyinstaller/rubyinstaller-2.2.3-x64.exe  64位的

https://ruby.taobao.org/  

安装过程中请注意勾选Add Ruby executables to your PATH

ruby -v
gem sources --remove https://rubygems.org/ //1.删除原gem源
gem sources -a https://ruby.taobao.org/ //2.添加国内淘宝源
gem sources -l //3.打印是否替换成功 //安装如下(如mac安装遇到权限问题需加 sudo gem install sass)
gem install sass
gem install compass sass -v
compass -v gem update sass //更新sass
sass -v //查看sass版本
sass -h //查看sass帮助

....

学习笔记:SASS的更多相关文章

  1. 学习笔记 - Sass的安装与使用手册

    最近因为工作需要,自学了Sass.现在将学习笔记整理在这里,供大家参考. 1. Sass的安装 Sass的编辑器安装方法有很多,大致能分为两种:应用程序(application)和命令行界面(comm ...

  2. sass学习笔记 -- sass的四种编译方法

    sass的四种编译方法:(.scss) (一)ruby下的命令行编译 首先需要安装ruby,注意需勾选Add Ruby executables to your PATH选项,以添加环境变量. ruby ...

  3. Sass学习笔记之入门篇

    Sass又名SCSS,是CSS预处理器之一,,它能用来清晰地.结构化地描述文件样式,有着比普通 CSS 更加强大的功能. Sass 能够提供更简洁.更优雅的语法,同时提供多种功能来创建可维护和管理的样 ...

  4. Sass学习笔记(补充)

    阅读目录 1. Sass和SCSS的区别 2. @while循环 3. @at-root 4. @content 5. 凸显注释 6. CSS输出样式 7. 重置浏览器样式 8. Sass调试和@de ...

  5. sass个人学习笔记

    Materliu 在慕课的视频: http://www.imooc.com/learn/364 . http://www.imooc.com/wiki/371 sass入门:http://www.w3 ...

  6. Sass简单、快速上手_Sass快速入门学习笔记总结

    Sass是世界上最成熟.稳定和强大的专业级css扩展语言 ,除了Sass是css的一种预处理器语言,类似的语言还有Less,Stylus等. 这篇文章关于Sass快速入门学习笔记. 资源网站大全 ht ...

  7. gulp学习笔记3

    gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 1.编译sass Sass 是一种 CSS 的开发工具,提供了许多便利的写法,大 ...

  8. JavaScript学习笔记:数组reduce()和reduceRight()方法

    很多时候需要累加数组项的得到一个值(比如说求和).如果你碰到一个类似的问题,你想到的方法是什么呢?会不会和我一样,想到的就是使用for或while循环,对数组进行迭代,依次将他们的值加起来.比如: v ...

  9. stylus入门学习笔记

    title: stylus入门学习笔记 date: 2018-09-06 17:35:28 tags: [stylus] description: 学习到 vue, 有人推荐使用 stylus 这个 ...

  10. Angular6 学习笔记——组件详解之组件通讯

    angular6.x系列的学习笔记记录,仍在不断完善中,学习地址: https://www.angular.cn/guide/template-syntax http://www.ngfans.net ...

随机推荐

  1. eclipse中maven本地库和远程阿里库的配置

    很久没有写博客了,最近比较闲将最近学的和遇到的问题做一个备忘 1.eclipse中maven本地库的配置 如果只是下载和安装了maven没有指定maven本地库的位置,maven的默认的本地库在c:/ ...

  2. 认识jmeter

    1.jmeter是什么:Apache Jmeter是Apache组织开发的基于java的压力测试工具. Jmeter可用于对服务器.网络或对象模拟巨大的负载,来自不同压力类别下测试他们的强度和分析整体 ...

  3. Java语法基础学习DayNineteen(反射机制)

    一.Refection定义 1.概述 Reflection(反射)是被视为动态语言的关键,反射机制允许程序在执行期借助于Reflection API取得任何类的内部信息,并能直接操作任意对象的内部属性 ...

  4. 浅谈URI和URL

    URI(Uniform Resource Identifier)字面上的意思是,统一资源标示符 URL(Uniform Resource Locator),统一资源定位符 光从字面上的意思,这个2个东 ...

  5. nginx下运行php的程序时返回200访问却是空白页问题的解决方法

    由于nginx与php-fpm之间的一个小bug,会导致这样的现象: 网站中的静态页面 *.html 都能正常访问,而 *.php 文件虽然会返回200状态码, 但实际输出给浏览器的页面内容却是空白. ...

  6. ecmall 学习记录

    1. /* 载入配置项 */ $setting =& af(MODULE); Conf::load($setting->getAll()); af方法定义如下: /** * 获取数组文件 ...

  7. Beta周王者荣耀交流协会第四次Scrum会议

    1.立会照片 成员王超,高远博,冉华,王磊,王玉玲,任思佳,袁玥全部到齐. master:任思佳 2.时间跨度: 2017年11月13日 11:40 — 12:10 ,总计30分钟. 3.地点: 一食 ...

  8. hdu 1754 I Hate It (单点修改+区间最值+裸题)

    Time Limit: 9000/3000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submission(s) ...

  9. 学习笔记TF036:实现Bidirectional LSTM Classifier

    双向循环神经网络(Bidirectional Recurrent Neural Networks,Bi-RNN),Schuster.Paliwal,1997年首次提出,和LSTM同年.Bi-RNN,增 ...

  10. PythonStudy——文件操作习题 Document operation exercises

    # 1.统计文件数据中字母e出现的次数(不区分大小写)# 文件内容:hello friend, can you speak English!# 结果:4# 分析:将文件内容读出,然后统计读出的字符串中 ...