Compass css3

@include box-shadow(rgba(88,88,88,0.4) 0 0 20px 5px);

最后不用的参数就可以不写,rgba可以设透明度alpha,所以在photoshop里面算好rbg值来写也挺好的。

上面示例的0 0 是纵向以及横向偏移值。

20px是位移,5px是扩散。

最后省略了一位 inset。

http://compass-style.org/reference/compass/css3/box_shadow/

compass里面难道没有渐变写法?

先直接写了

background: -webkit-gradient(linear, left top, left
bottom,from(#000),color-stop(0.8,#191919),to(#000));

在80%的地方是#191919,上下两侧是#000

如果只有两个颜色

background: -webkit-gradient(linear, 0 0, 0 100%, from(#000000),
to(#191919));

Compass css3,布布扣,bubuko.com

时间: 2024-10-14 15:19:59

Compass css3的相关文章

compass初探

1.安装compass: sudo gem install compass 如果你用的是Windows系统,那么要省略前面的sudo. 2.项目初始化 接下来,(首先要进入目标目录.)要创建一个你的Compass项目,假定它的名字叫做myproject,那么在命令行键入: 进入目标目录语法: 列1.根目录是驱动器的目录树状结构的顶层,要返回到根目录,在命令行输入:cd \ 例2.如果想返回到上一层目录,在当前命令提示符下输入cd..如下图: 例3.如果想进入下一层目录,在当前命令提示符下输入cd

compass 基础

/*! Welcome to Compass. * In this file you should write your main styles. (or centralize your imports) * Import this file using the following HTML or equivalent: * <link href="/stylesheets/screen.css" media="screen, projection" rel=

揭开Sass和Compass的神秘面纱

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

compass模块

Compass核心模块Reset :重置CSS模块 @import "compass/reset" Layout :页面布局的控制能力 @import "compass/layout" 只有这两个模块是需要明确 指定引入的@import "compass"默认包含了其他五大模块却不包含resrt,layout 其他四个功能模块和Browser support模块CSS3:跨浏览器的CSS3能力Helpers:内含一系列的函数,跟SASS的函数列表

使用compass更高效的编辑css --- 图片精灵

compass是sass的一个库,关系相当于js中的jq.比较可惜的是compass的文档比较混乱 看的不太舒服,下面是compass的文档地址,有兴趣的可以去看看 http://compass-style.org/help/documentation/ 在这里我就不仔细讲compass的知识了,可以去阮一峰的博客里面有一遍compass的介绍,附上链接地址 http://www.ruanyifeng.com/blog/2012/11/compass.html 这里主要讲的是图片精灵,我们在网上

sass与compass实战(读书笔记)

// compass create myproject // compass compile // compass compile --force 重新编译未改动的 // compass compile --output-style compressed // compass compile --output-style compressed --force // compass watch // compass模块:reset css3 layout typography utilities

(二)在实战中使用Sass和Compass

第三章 无需计算玩转CSS网格布局 3.1 网格布局介绍 3.2 使用网格布局 3.2.1 术语 1 术语名 定义 是否涉及HTML标签 2 列 内容度量的垂直单位 否 3 容器 构成一个网格布局的HTML元素 是 4 槽 网格布局中列与列之间的统一留白 否 3.2.3 固定的网格布局还是流动的网格布局 1 // 由于网络用户的屏幕尺寸不一,设计人员有两种选择: 2 // 1.要么选择一种对于大多数用户合理的固定布局大小(并且限制这种布局内的内容不溢出); 3 // 2.要么实现一种灵活的流动布

Compass用法指南

Compass用法指南 作者: 阮一峰 Sass是一种"CSS预处理器",可以让CSS的开发变得简单和可维护.但是,只有搭配Compass,它才能显出真正的威力. 一.Compass是什么? 简单说,Compass是Sass的工具库(toolkit). Sass本身只是一个编译器,Compass在它的基础上,封装了一系列有用的模块和模板,补充Sass的功能.它们之间的关系,有点像Javascript和jQuery.Ruby和Rails.python和Django的关系. 二.安装 Co

(一)认识Sass和Compass

第一章 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