如何结合Gulp使用PostCss

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

业界 2016年07月04日

sass常用语法

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

业界 2016年07月04日

Sass 与 SCSS 是什么关系？

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

业界 2016年07月06日

SASS 学习笔记

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

业界 2016年07月06日

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

业界 2016年07月10日

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

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

业界 2016年07月12日

Sass 快速入门教程

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

业界 2016年07月14日

WEB前端 - “懒人”养成计划

何为懒？       懒在人一开始的印象中，总是给人一种不好的感觉，勤奋一直是传统美德，懒是坏东西。然而事实真是这样吗？最近看过一篇关于懒人科技的文章，觉得很有道理，文章有如下部分：       人类历史上曾诞生了琳琅满目的懒人科技，不断迁就着人性的弱点，有汽车、火车、飞机这种大型地、颠覆式发明，也有一些非常酷炫的小型创意，甚至还诞生了不错的服务，事实上，整个第三产业的市场

技术开发 2016年07月14日

SASS @etend官方文档剖析

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

业界 2016年07月16日

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

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

业界 2016年07月18日