学习笔记:SASS
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位的
安装过程中请注意勾选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的更多相关文章
- 学习笔记 - Sass的安装与使用手册
最近因为工作需要,自学了Sass.现在将学习笔记整理在这里,供大家参考. 1. Sass的安装 Sass的编辑器安装方法有很多,大致能分为两种:应用程序(application)和命令行界面(comm ...
- sass学习笔记 -- sass的四种编译方法
sass的四种编译方法:(.scss) (一)ruby下的命令行编译 首先需要安装ruby,注意需勾选Add Ruby executables to your PATH选项,以添加环境变量. ruby ...
- Sass学习笔记之入门篇
Sass又名SCSS,是CSS预处理器之一,,它能用来清晰地.结构化地描述文件样式,有着比普通 CSS 更加强大的功能. Sass 能够提供更简洁.更优雅的语法,同时提供多种功能来创建可维护和管理的样 ...
- Sass学习笔记(补充)
阅读目录 1. Sass和SCSS的区别 2. @while循环 3. @at-root 4. @content 5. 凸显注释 6. CSS输出样式 7. 重置浏览器样式 8. Sass调试和@de ...
- sass个人学习笔记
Materliu 在慕课的视频: http://www.imooc.com/learn/364 . http://www.imooc.com/wiki/371 sass入门:http://www.w3 ...
- Sass简单、快速上手_Sass快速入门学习笔记总结
Sass是世界上最成熟.稳定和强大的专业级css扩展语言 ,除了Sass是css的一种预处理器语言,类似的语言还有Less,Stylus等. 这篇文章关于Sass快速入门学习笔记. 资源网站大全 ht ...
- gulp学习笔记3
gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 1.编译sass Sass 是一种 CSS 的开发工具,提供了许多便利的写法,大 ...
- JavaScript学习笔记:数组reduce()和reduceRight()方法
很多时候需要累加数组项的得到一个值(比如说求和).如果你碰到一个类似的问题,你想到的方法是什么呢?会不会和我一样,想到的就是使用for或while循环,对数组进行迭代,依次将他们的值加起来.比如: v ...
- stylus入门学习笔记
title: stylus入门学习笔记 date: 2018-09-06 17:35:28 tags: [stylus] description: 学习到 vue, 有人推荐使用 stylus 这个 ...
- Angular6 学习笔记——组件详解之组件通讯
angular6.x系列的学习笔记记录,仍在不断完善中,学习地址: https://www.angular.cn/guide/template-syntax http://www.ngfans.net ...
随机推荐
- 扫描工具——Nmap用法详解
Nmap使用 Nmap是主机扫描工具,他的图形化界面是Zenmap,分布式框架为Dnamp. Nmap可以完成以下任务: 主机探测 端口扫描 版本检测 系统检测 支持探测脚本的编写 Nmap在实际中应 ...
- jquery mCustomScrollbar 滚动条宽度的设置
一.项目使用 $("#iscroll-1, #tree_box, .work, .item1, .item2, .item3, .item4").mCustomScrollbar( ...
- 大大维的游戏机计划1--贪吃蛇v1
本文为大大维原创,最早于博客园发表,转载请注明出处!!! 虽然本人一直是个免费的游戏测试员(/手动滑稽),但一直有着一个游戏架构师的梦想.正如马爸爸所说,梦想还是要有的,万一实现了呢? 这些天放寒假, ...
- 分布式队列celery 异步----Django框架中的使用
仅仅是个人学习的过程,发现有问题欢迎留言 一.celery 介绍 celery是一种功能完备的即插即用的任务对列 celery适用异步处理问题,比如上传邮件.上传文件.图像处理等比较耗时的事情 异步执 ...
- shell批处理文件,并将运算结果返回
问题背景是这样的:别人用C++写了一个算法,算法内部比较复杂,但是呢,对于编译好的文件用起来比较方便,比如在linux终端,my_program 1.png 2.txt这样就可以用,但是这样只能够输入 ...
- tree-lstm初探
https://zhuanlan.zhihu.com/p/35252733 可以先看看上面知乎文章里面的例子 Socher 等人于2012和2013年分别提出了两种区分词或短语类型的模型,即SU-RN ...
- Office常用技巧
文章目录 大小写切换 把word里的自动编号转换为真实的文本 大小写切换 word中修改单词/句子的大小写:选中文字,按shift+F3,可在全大写.全小写.首字符大写间切换. 把word里的自动编号 ...
- expect脚本实现ssh自动登录
1:简单的实现ssh登录 #!/usr/bin/expect set ip "10.0.0.142" set user "root" set password ...
- nginx的白名单
为nginx设置白名单的几个步骤: 第一步:指定能访问的白名单 vim /etc/nginx/ip.conf (如果在公司,记得这里是外网IP,要不然测很久都不知道为什么不行) ; 第二步 ...
- LiveBindings --- 把对象之间的属性绑定起来
有了 FireMonkey 框架,它不同于 VCL ,以往的数据感知控件不能放在它上面,所以 XE2 提供了 LiveBindings 功能作为替代方案.另外它也是个通用的基础设施,同样可用于传统的V ...