Compass由Resources,Commands,Logs三个部分组成 Resources包含了Links和Fonts: Commands可以执行php命令,比如创建model: 创建一个Download的Model: 提示创建成功: Logs日志记录…

前段时间在使用Compass时遇到了其为难处理的一个坑,现记录到博客希望能帮助到各位. 一.问题: 利用Koala或者是gulp编译提示如下,截图为koala编译提示错误: 二.解决办法 从问题截图上看提示是找不到.sass-cache文件夹下面的一个文件夹(父级目录名称中带有特殊字符很容易重现),然后几经纠结发现可以不开启或关闭sass的缓存功能.也就是修改config.rb的配置节点即可,如下图所示: 1.如果cache设置为true,请设置cahce_path的路径(目录层级尽量少).…

reset 可以重置浏览器的的html的默认样式,因为各个浏览器对有些元素解析差别很大 通过重置样式可以让样式的浏览器兼容 更简单 使用方法简单 @import "compass/reset" layout 有几个常见的布局函数,我觉得挺管用,其他的都是用来写组建非常常用的 Sticky Footer 该模块提供了需要布置你的页脚,它坚持到页面底部的工具. 这个模块主要用于布局页脚,可以让页脚固定在页面的最底部,是一个比较常用的功能,而且有配套的html代码 引用方法 @import…

Sass 是 CSS 的扩展,增加了嵌套规则,变量,混入功能等很多更多.它简化了组织和维护 CSS 代码的成本.Compass 是一个开源的 CSS 框架,使得使用 CSS3 和流行的设计模式比以往任何时候都更容易. 在这篇文章中,我们已经收集了一组有用的 Sass 和 Compass 工具,将帮助您快速构建 Web 应用程序. 您可能感兴趣的相关文章 网站开发中很有用的 jQuery 效果[附源码] 分享35个让人惊讶的 CSS3 动画效果演示 十分惊艳的8个 HTML5 & JavaScri…

来源 http://snugug.github.io/RWD-with-Sass-Compass/#/ 1 安装 COMPASS 扩展 安装 方式 gem 'extension', '~>X.Y.Z' 命令行安装 require '{extension}' @import '{extension}'; sass 文件导入   扩展1 http://breakpoint-sass.com/ 扩展2 http://singularity.gs/ 3 盒子模型 @import 'compass'; /…

demo 源码 地址 https://github.com/qqqzhch/webfans compass  的表格提供了集中常见样式 表格边框 outer-table-borders($width, $color)  控制外边边框的尺寸和颜色 inner-table-borders($width, $color) 控制里面边框的尺寸和颜色 例如 .table1{ table { @include inner-table-borders(1px, #7a98c6); @include outer…

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

最基本的api 是对比色,对与我这种菜鸟来说,没有什么比在一个背景色下 用什么颜色的文字坑蛋疼的事情了,这个工具可以帮助大家很好解决这个问题 api 地址 http://compass-style.org/reference/compass/utilities/color/contrast/ 要是真的能实现任何一个背景色 都可以选出来一个对比色 那就好了, 不过compass 并没有实现这个功能,而是先定义了一个淡色和深色,然后根据你传入的颜色判断,是给你返回深色好呢,还是返回淡色好呢 ,这个a…

demo 源码 地址 https://github.com/qqqzhch/webfans 什么是雪碧图? CSS雪碧 即CSS Sprites,也有人叫它CSS精灵,是一种CSS图像合并技术,该方法是将小图标和背景图像合并到一张图片上,然后利用css的背景定位来显示需要显示的图片部分. compass 中为我们提供了简洁的工具和方法生成雪碧图 API 在这里 http://compass-style.org/reference/compass/utilities/sprites/ 雪碧图 只须…

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…