sass

如何结合Gulp使用PostCss

摘要PostCSS 是使用 JS 插件来转换 CSS 的工具,支持变量,混入,未来 CSS 语法,内联图像等等。PostCSS的目标是通过自定义插件和工具这样的生态系统来改造CSS。与Sass和Less这些预编译器相同的原则,PostCSS把扩展的语法和特性转换成现代的浏览器友好的CSS。使用Gulp工具,我们可以通过构建过程转换样式,就像Sass和Less的编译。正文Po

sass常用语法

sass常用语法 sass是css的预处理器,提供了很多方便的语法,如嵌套、可复用代码块等,但是我们在做一般程序的时候用不上这么多功能,这里总结了sass里我用的最多的几种常用语法: 定义变量 $ff: Arial; $font-color: # ccc; $background-grey: # f5f5f5; 元素(包含伪类)的嵌套 a {color: $font-col

Sass 与 SCSS 是什么关系?

我最近写了很多 Sass 代码,但是最近发现并不是每一个人都知道 Sass 具体是什么。下面是一个简短的说明:当我们说起 Sass ,我们经常指的是两种事物:一种 css 预处理器和一种语言。我们经常这样说,“我们正在使用 Sass”,或者 “这是一个 Sass mixin”。同时,Sass (预处理器)有两种不同的语法:Sass,一种缩进语法SCSS,一种 CSS-lik

SASS 学习笔记

基础知识这部分内容摘自 Sass Basics。预处理 Preprocessing预处理功能,就是将 SASS/SCSS 格式的文件输出为 CSS 文件,可以对单个文件进行预处理,也可以对指定目录进行预处理,还可以对指定目录进行实时监控,基本语法如下:sass input.scss output.csssass --watch app/sass:public/stylesh

node-sass 安装卡在 node scripts/install.js 解决办法

======== 7月12日更新 ========总的来说就是两种方法解决:SASS_BINARY_SITE=https://npm.taobao.org/mirrors/node-sass/ npm install或者在 ~/.npmrc 里添加下面这行(参考),保存后再 npm install(如果是用的 cnpm,需要添加到 ~/.cnpmrc)sass_binar

巧用SASS之如何遍历n个子元素并为其设置属性

最近在新项目中引入了 SASS 来编写样式代码,心想既然用到了这种高端货,就要用得巧用得妙,不能单纯地只是把常用属性定义成变量或定义重用的代码块等等。因此在编写样式时,都要时刻提醒自己是不是可以巧用SASS来解决一些问题。这次遇到的需求是, 里有7个重复的 1. ,这7个 需要应用7中不同颜色的 background-color ,需求很简单,如下是简易的效果图。针对这

Sass 快速入门教程

@import若不想将scss编译成css文件,在scss文件名前面加上下划线_。使用CSS @import指令默认情况下@import在当前目录下需找scss文件加载,若想使用原生css的import指令可以使用下面四个规则:当@import后面跟上的文件名是以.css结尾的时候;当@import后面跟的是http://开头的字符串的时候;当@import后面跟的是一个u

SASS @etend官方文档剖析

@extend用法剖析我们经常会遇到这样的情况,当我们在开发页面时候一个class需要包含前一个class的所有样式,但是又必须有他自己特殊新增的样式。但是这两个class其实都是相差无几的,只是有细微的差别。比如错误提示的样式(.error和.specialerror),既然后着只是比前者多一两句样式,为何还要写两个class呢,因为我们不想把前者.error的样式重新在

用vue+webpack+es6+sass实现Cnode网站(一)

写在文章前:最近把官网的vue文档过了一遍,准备写个项目来巩固下自己对vue的学习。因为cnode网站有开放的api,所以我决定用vue+webpack+es6+sass的技术栈去实现这个网站(单页面的形式)。这篇系列的文章我主要是分享下自己怎么开发还有怎么实现一个个vue组件去构建整个网站。关于webpack配合vue的使用可以关注我的另外一篇博文webpack+vue配

Sass

Sass 是一个CSS 的扩展,在语法CSS语法的基础上,增加变量,嵌套规则, 混合,导入,函数等功能 对CSS进行预处理的“中间语言” 文件格式 .sass ,.scss scss是对css的一种拓展,跟css很像,是开发中最常用的模式。 Sass从第三代开始,放弃了缩进风格,并且完全向下兼容普通的CSS代码。被称为scss 编译Sass Node环境 sass app.