compass 中一些常用api 包括一些浏览器hack @import "compass/utilities/general" Clearfix Clearfix 是用来清除浮动 float 造成的内容问题,以前用clear 方法可以解决,通过查看Clearfix 的源码发现对与高版本的浏览器其实已经可以不用了 @mixin clearfix { overflow: hidden; @include has-layout; } 用overflow 就可以了 而对于低版本的浏览器 例如…

Bullets 用来定义ul li 相关的样式 no-bullet  关闭 li的默认样式 那个小圆点 no-bullets 作用域ul 调用no-bullet 函数 不过用了reset 后 默认没有小圆点了 pretty-bullets($bullet-icon, $width, $height, $line-height, $padding) @mixin pretty-bullets($bullet-icon, $width: image-width($bullet-icon), $hei…

最近在慕课网学习Sass和Compass,学习链接地址:https://www.imooc.com/learn/364,现在整理笔记如下: 一.使用Sass和Compass的优点: a.使用Sass和Compass可以写出更优秀的CSS. b.解决CSS编程过程中的痛点问题,例如精灵图合图等. c.有效地组织样式,图片,字体等项目元素. 二.Sass简介 1.Sass是为了让我们写出更高效的可维护性的CSS代码. 2.Sass的语法: 使用缩进式语法:.sass作为文件的扩展名,这种语法是:对空…

demo 下载http://vdisk.weibo.com/s/DOlfkrAWjkF/1401192855 为什么要学习Sass和compass ?提高站独立和代码产品化的绝密武器,尤其是程序化css,可以将写程序的各种理论融入其中,打造NB的产品 首先 安装 ruby http://rubyinstaller.org/downloads/ 注意 建议安装ruby1.93 这个版本 最新版的ruby不靠谱 我在sass和Sencha Touch里面遭遇过倒霉的问题 安装了ruby 还要添加ru…

导言 CSS不是一门真正意义上的编程语言,很多编程语言理所当然的特性(比如变量),都不被支持.同时再开发模块化的web项目的时候,也要避免相互干扰.为了弥补CSS的这些不足,就产生了CSS预处理器,Sass则是其中的佼佼者. 什么是Sass Sass是最成熟.稳定.强大.专业的CSS扩展语言(官方解释).直白点,Sass就是一个非常好用的CSS预处理器,为css引入部分编程语言的特性. Sass在现阶段,有两种编码的语法,一个是兼容CSS语法的Scss格式文件,一个是Haml.Ruby类似语法的…

compass Compass是Sass的工具库,就好像jQuery是js的库一样. sass有了compass的配合,就会更加事半功倍. Sass本身只是一个编译器,Compass在它的基础上,封装了一系列有用的模块和模板,补充Sass的功能.它们之间的关系,有点像Javascript和jQuery.Ruby和Rails.python和Django的关系.(by:阮一峰http://www.ruanyifeng.com/blog/2012/11/compass.html) 官网:http://…

揭开Sass和Compass的神秘面纱 可能之前你像我一样,对Sass和Compass毫无所知,好一点儿的可能知道它们是用来作为CSS预处理的.那么,今天请跟我一起学习下Sass和Compass的一些基础知识,包括它们是什么.如何安装.为什么要使用.基础语法等一些基本知识.需要说明的是我也仅仅只是刚刚接触Sass和Compass,一些高级用法等将不再本文的讨论范围之内.接触一周以后发现Sass和Compass的用处非常大,也打算今后在项目中尝试引进并应用起来.希望读完以后,你跟我一样对Sass和…

第一章 Sass和Compass让样式表重焕青春 // 内容概要// 开始学习Sass和动态样式表// 用Sass更高效地写样式表// Compass简介// 用Compass迎接工程实践中的样式挑战 1.2.1 通过变量来复用属性值 1 声明变量:$blue:#1875e7; 2 调用变量:.blue { color:$blue; } 1.2.2 通过嵌套来快速写出多层级的选择器 1 ul{ 2 float:right; 3 li { 4 float:left; 5 a{ color:#111…

第一章 Sass和Compass让样式表重焕青春 // 内容概要// 开始学习Sass和动态样式表// 用Sass更高效地写样式表// Compass简介// 用Compass迎接工程实践中的样式挑战 1.2.1 通过变量来复用属性值 声明变量:$blue:#1875e7; 调用变量:.blue { color:$blue; } 1.2.2 通过嵌套来快速写出多层级的选择器 ul{ float:right; li { float:left; a{ color:#111; } } } 1.2.3…

最近开始在尝试开始使用Sass来写CSS代码,刚开始虽然还是不太习惯用链式的方式写css,不过这是暂时的阶段. 如果你还不了解Sass,可以看之前发表过的文章来了解详情,Sass主要有下面这几种特性(主要内容来自这里) 左邊為原始scss檔,右邊為編譯過後的:1.Variables 變數使用$作為開頭當參數 2.Nesting 巢狀結構很清楚的知道 誰是誰的子元素,不用像以前一樣 寫一大排重復的開頭了 3.Mixins 其實就像function一樣使用,還可以帶參數 設定預設參數 4.Inher…