compass安装教程
*:first-child {
margin-top: 0 !important;
}
body>*:last-child {
margin-bottom: 0 !important;
}
/* BLOCKS
=============================================================================*/
p, blockquote, ul, ol, dl, table, pre {
margin: 15px 0;
}
/* HEADERS
=============================================================================*/
h1, h2, h3, h4, h5, h6 {
margin: 20px 0 10px;
padding: 0;
font-weight: bold;
-webkit-font-smoothing: antialiased;
}
h1 tt, h1 code, h2 tt, h2 code, h3 tt, h3 code, h4 tt, h4 code, h5 tt, h5 code, h6 tt, h6 code {
font-size: inherit;
}
h1 {
font-size: 28px;
color: #000;
}
h2 {
font-size: 24px;
border-bottom: 1px solid #ccc;
color: #000;
}
h3 {
font-size: 18px;
}
h4 {
font-size: 16px;
}
h5 {
font-size: 14px;
}
h6 {
color: #777;
font-size: 14px;
}
body>h2:first-child, body>h1:first-child, body>h1:first-child+h2, body>h3:first-child, body>h4:first-child, body>h5:first-child, body>h6:first-child {
margin-top: 0;
padding-top: 0;
}
a:first-child h1, a:first-child h2, a:first-child h3, a:first-child h4, a:first-child h5, a:first-child h6 {
margin-top: 0;
padding-top: 0;
}
h1+p, h2+p, h3+p, h4+p, h5+p, h6+p {
margin-top: 10px;
}
/* LINKS
=============================================================================*/
a {
color: #4183C4;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
/* LISTS
=============================================================================*/
ul, ol {
padding-left: 30px;
}
ul li > :first-child,
ol li > :first-child,
ul li ul:first-of-type,
ol li ol:first-of-type,
ul li ol:first-of-type,
ol li ul:first-of-type {
margin-top: 0px;
}
ul ul, ul ol, ol ol, ol ul {
margin-bottom: 0;
}
dl {
padding: 0;
}
dl dt {
font-size: 14px;
font-weight: bold;
font-style: italic;
padding: 0;
margin: 15px 0 5px;
}
dl dt:first-child {
padding: 0;
}
dl dt>:first-child {
margin-top: 0px;
}
dl dt>:last-child {
margin-bottom: 0px;
}
dl dd {
margin: 0 0 15px;
padding: 0 15px;
}
dl dd>:first-child {
margin-top: 0px;
}
dl dd>:last-child {
margin-bottom: 0px;
}
/* CODE
=============================================================================*/
pre, code, tt {
font-size: 12px;
font-family: Consolas, "Liberation Mono", Courier, monospace;
}
code, tt {
margin: 0 0px;
padding: 0px 0px;
white-space: nowrap;
border: 1px solid #eaeaea;
background-color: #f8f8f8;
border-radius: 3px;
}
pre>code {
margin: 0;
padding: 0;
white-space: pre;
border: none;
background: transparent;
}
pre {
background-color: #f8f8f8;
border: 1px solid #ccc;
font-size: 13px;
line-height: 19px;
overflow: auto;
padding: 6px 10px;
border-radius: 3px;
}
pre code, pre tt {
background-color: transparent;
border: none;
}
kbd {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background-color: #DDDDDD;
background-image: linear-gradient(#F1F1F1, #DDDDDD);
background-repeat: repeat-x;
border-color: #DDDDDD #CCCCCC #CCCCCC #DDDDDD;
border-image: none;
border-radius: 2px 2px 2px 2px;
border-style: solid;
border-width: 1px;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
line-height: 10px;
padding: 1px 4px;
}
/* QUOTES
=============================================================================*/
blockquote {
border-left: 4px solid #DDD;
padding: 0 15px;
color: #777;
}
blockquote>:first-child {
margin-top: 0px;
}
blockquote>:last-child {
margin-bottom: 0px;
}
/* HORIZONTAL RULES
=============================================================================*/
hr {
clear: both;
margin: 15px 0;
height: 0px;
overflow: hidden;
border: none;
background: transparent;
border-bottom: 4px solid #ddd;
padding: 0;
}
/* TABLES
=============================================================================*/
table th {
font-weight: bold;
}
table th, table td {
border: 1px solid #ccc;
padding: 6px 13px;
}
table tr {
border-top: 1px solid #ccc;
background-color: #fff;
}
table tr:nth-child(2n) {
background-color: #f8f8f8;
}
/* IMAGES
=============================================================================*/
img {
max-width: 100%
}
-->
compass安装教程
compass和sass相当于,jquery和javascript,一个是封装的css库,另一个是javascript库,它们都目的是一样的,简化开发。
安装
一般来说,安装SASS
的话,会自动帮助你安装compass。如果不确认是否有安装compass,在cmd中输入
compass -v
显示 'compass
' 不是内部或外部命令,也不是可运行的程序或批处理文件。代表未安装compass。
显示如下,那么安装成功。
D:\WEB\aaa\myproject>compass -v
Compass 1.0.3 (Polaris)
Copyright (c) 2008-2015 Chris Eppstein
Released under the MIT License.
Compass is charityware.
Please make a tax deductable donation for a worthy cause: http://umdf.org/compass
安装指令
gem update --system #先更新gem
gem install compass #安裝Compass
其它指令
gem query –remote #卸载
md mycompass /# md 建立空文件夹
建立compass项目
cmd进入网站目录,在cmd中,输入以下指令。
compass create myproject
myproject是项目的名字,执行后,会下载compass项目文件到指定目录下: - config.rb -> 配置文件 - .sass-cache -> 缓存文件 - sass -> sass文件 - stylesheets -> sass编译文件
cofing.rb 配置文件
http_path = "/"
css_dir = "stylesheets"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "javascripts" //可以外加指令
output_style = :compressed //编译格式指定
编译文件
执行编译
compass compile
只有在配置文件下,才能执行编译,不然会找不到.scss文件。
D:\WEB\aaa\mycompass\myproject\sass>compass compile
Compass can't find any Sass files to compile.
Is your compass configuration correct?.
If you're trying to start a new project, you have left off the directory argumen
t.
Run "compass -h" to get help.
在命令行模式下,除了一次性编译命令,compass还有自动编译命令
compass watch
结束自动编译按 CTRL + C
,同样,也需要在配置文件下执行自动编译,才执行。
调用模块报错
如果调用模块报错,有可能是编码错误。
compass安装教程的更多相关文章
- Linux+apache+mono+asp.net安装教程
Linux+apache+mono+asp.net安装教程(CentOS上测试的) 一.准备工作: 1.安装linux系统(CentOS,这个就不多讲了) 2.下载所需软件 http-2.4.4.ta ...
- Greenplum 源码安装教程 —— 以 CentOS 平台为例
Greenplum 源码安装教程 作者:Arthur_Qin 禾众 Greenplum 主体以及orca ( 新一代优化器 ) 的代码以可以从 Github 上下载.如果不打算查看代码,想下载编译好的 ...
- git 安装教程
昆,简单说下安装教程1,安装Git2,安装TortoiseGit3,打开第一步安装的git工具GIT BASH
- Docker和Docker-compose安装教程以及docker-elk,docker-storm安装教程
此安装教程仅供我自己安装配置时查看,其他的人不可以偷看!!! 安装Docker 1. Update package information, ensure that APT works with th ...
- RHEL 6.3 详细安装教程
以前刚接触linux时,什么都不懂,为了学习,在电脑上安装双系统(原系统为Win7),吃过不少苦头,在网上搜教程,很多都是语焉不详,导致安装过程中战战兢兢.最近朋友面试运维,面试官有考他对linux安 ...
- Android Studio的下载和安装教程(从ADT到AS)
之前一直使用的是Android development tools(简称ADT),后来说是google对ADT不再提供支持,然后一直在考虑是否把自己电脑换成Android Studio(简称AS),从 ...
- mysql快速导出数据库ER图和数据字典(附navicat11安装教程及资源)
♣ mysql使用navicat11快速导出数据库ER图 ♣ mysql使用navicat11快速导出数据库数据字典 ♣ navicat11 for mysql (这里是mysql5.7.12)专业版 ...
- Smokeping安装教程
Smokeping安装教程 #Smokeping2.6.8安装教程 #2016.3.6 改编v1.0 #Linux运维技术交流 347163978 环境 CentOS release 6.4 (F ...
- (二)ADS1.2的安装教程以及使用 调试 (不会 AXD 调试工具)
安装教程: 参考百度 http://jingyan.baidu.com/article/cdddd41c7db85253cb00e1ae.html 具体使用看: 杨铸的那本书(嵌入式底层软件驱动开发) ...
随机推荐
- HTML 5 新标签
HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准.它希望能够减少浏览器对于需要插件的丰富性网络应用服务( ...
- [置顶] 北漂的大三IT男(暂完)
今天是2013年8月9日,是我待在北京的最后一个晚上,今天我已经正式向公司提出辞职了,虽然公司已经答应从下个月起涨部分工资,但是我还是坚决的离开了,回想当时进公司的想法----------干了一个月后 ...
- 【九】注入框架RoboGuice使用:(Your First Injected Service and BroadcastReceiver)
上一篇我们简单的介绍了一下RoboGuice的使用([八]注入框架RoboGuice使用:(Your First Injected Fragment)),今天我们来看下服务(Service)和广播接受 ...
- bp神经网络及matlab实现
本文主要内容包含: (1) 介绍神经网络基本原理,(2) AForge.NET实现前向神经网络的方法,(3) Matlab实现前向神经网络的方法 . 第0节.引例 本文以Fisher的Iris数据集 ...
- SQL 语句优化—— (二) 索引的利用
索引是与表或视图关联的磁盘上结构,可以加快从表或视图中检索行的速度.索引包含由表或视图中的一列或多列生成的键.与书中的索引一样,数据库中的索引使您可以快速找到表或索引视图中的特定信息.索引包含从表或视 ...
- 大写String和小写string的区别
1.string是c#中的类,String是.net Framework的类(在c# IDE中不会显示蓝色) ; 2.c# string映射为.net Framework的String ; 3.如果用 ...
- C# 微信公众平台开发(1)-- 服务器配置
题记:最近公司需要开发微信服务号,由本人负责,以前虽然听过微信开发,但并没有认真的去了解,项目开发中,也边看文档边开发,记录自己的项目开发经验: 1.注册帐号--填写服务器配置 在https://mp ...
- BZOJ 1066: [SCOI2007]蜥蜴( 最大流 )
结点容量..拆点然后随便写 --------------------------------------------------------------- #include<cstdio> ...
- C++学习之文件的输入输出
C++学习之文件的输入输出 一.文件的打开与关闭 1.输出数据到文件 文件的操作需要包含fstream头文件,文件的操作对象为ifstream,ofstrea ...
- Windows主机和Linux虚拟机之间传输文件
如果使用VirtualBox的增强功能, 可以实现两者之间文件相互拖拽. 但某些情况下, 比如增强功能安装遇到难以解决的问题, 或者Linux版本为server版本(例如Ubuntu Server发行 ...