课程/Sass/Less/前端开发
Sass和Compass必备技能之Compass
-
-
Sandaydi
2019-03-30
Typography
-
截图
0赞 · 0采集
-
-
Sandaydi
2019-03-30
Reset
-
截图
0赞 · 0采集
-
-
Sandaydi
2019-03-30
narmalize
-
截图
0赞 · 0采集
-
-
jxcool8
2018-10-11
目录路径配置
-
0赞 · 0采集
-
-
骑士先生
2018-07-30
Compass 核心模块
-
截图
0赞 · 0采集
-
-
Moirai
2018-03-18
- Compass核心模块
-
截图
0赞 · 0采集
-
-
可乐猫
2018-02-24
- compass核心模块
-
截图
0赞 · 0采集
-
-
lintaososo
2017-11-21
- 精灵图的处理。
-
截图
0赞 · 0采集
-
-
dabear
2017-11-19
- sprites设置
-
截图
0赞 · 0采集
-
-
dabear
2017-11-18
- *: 只在IE6. IE7版本下才识别(*zoom)
_: 只在IE6下才识别(_display, _height)
-
0赞 · 0采集
-
-
dabear
2017-11-18
- data uri
-
截图
0赞 · 0采集
-
-
dabear
2017-11-18
- 在引入子类之前,引入@import normalize-version
-
截图
0赞 · 0采集
-
-
dabear
2017-11-18
- 在注释的最前面加上“!“,避免被压缩
-
截图
0赞 · 0采集
-
-
dabear
2017-11-18
- require 'compass/import-once/activate' 将文件(即使是重复的)只引入一次;如果一定要重复引入,在引入文件的文件名后面加上感叹号即可
-
截图
0赞 · 0采集
-
-
丿热心市民姜某
2017-11-17
- compass 核心模块
-
截图
0赞 · 0采集
-
-
qq_专属人生S_0
2017-09-23
- normalize核心模块
base:用来统一HTML和body标签的字体,文字大小调整、边距等等。
html5:统一html5中新增的元素的展现形式
links:统一a便签的样式修饰,去掉hover和active时候的边线。
typography:统一b、strong、sub、sup等段落文本的样式修饰。
embeds:统一img,svg等标签的样式修饰(比如统一img标签的border为0 )
groups:统一figure、pre、code等标签的样式
forms:统一form相关的button、input、等标签的样式
tables:统一table相关的table、td、th等标签的样式
-
0赞 · 0采集
-
-
qq_专属人生S_0
2017-09-23
- 解决各浏览器默认样式不同,引入normalize解决
-
0赞 · 0采集
-
-
qq_专属人生S_0
2017-09-22
- require 'compass/import-once/activate'防止再次插入被引入文件
如果真的需要引入多次在引入后面加感叹号“!”,实例@import "compass/reset!"
注释的最前面加感叹号“!”,防止压缩文件注释丢失
-
0赞 · 0采集
-
-
qq_stay先锋_0
2017-08-30
- compass 内置了browser()函数;
返回浏览器的列表。
命令行中
compass interactive 中断compass watch
查看浏览器版本browser-versions();
-
1赞 · 0采集
-
-
慕后端3591366
2017-05-08
- require 'compass/import-once/activate'防止再次插入被引入文件
如果真的需要引入多次在引入后面加感叹号“!”,实例@import "compass/reset!"
注释的最前面加感叹号“!”,防止压缩文件注释丢失
-
0赞 · 1采集
-
-
哒哒___
2017-05-05
- normalize核心模块
-
截图
0赞 · 0采集
-
-
哒哒___
2017-05-05
- compass核心模块
-
截图
0赞 · 0采集
-
-
侠客岛的含笑
2017-04-29
- @import "compass/layout"; 有三个模块,如下:
@import "compass/layout/grid-background";定高,定宽,或者自适应的背景
@import "compass/layout/sticky-footer";提供页面中的页脚部分始终处于最底部的能力
@import "compass/layout/stretching";用于拉伸填满整个父容器的能力
@include stretch($offset-top: 0,0,0,0);(使用绝对定位)
@include sticky-footer(30px,"#my-root","#my-root-footer","#my-footer")
-
截图
1赞 · 1采集
-
-
侠客岛的含笑
2017-04-29
- 安装normalize
-npm install normalize.css
-component(bower) install normalize.css
-gem install compass-normalize
·引入插件
config.rb 'conpass-normalize'
·使用compressed输出格式时不想注释被隐藏掉,/*!在注释里面加"!"号*/
比如 @import "compass/reset!";
当使用compressed格式时,会去掉标准的Sass和CSS注释及空格。我们可以在注释前面加一个!避免删除。
/*! */
compass compile编译
Normalize核心模块
·base模块:统一html body字体文字大小边距
·html5:统一html5的元素
·links:统一a标签的样式,去掉边线
·typography:统一段落文本样式
·embeds:统一img、svg样式,比如border:0
·groups:统一
·forms:统一文字
·tables:统一表格的标签
分模块引入
@import "normalize-version"
@import "normalize/html5";
@import "compass/reset" 相当于 @import "compass/reset/utilities" @include global-reset();
-
截图
0赞 · 0采集
-
-
侠客岛的含笑
2017-04-29
- Reset重置样式
Layout页面布局控制能力
只有这两个模块需要指定引入
五大类模块
·CSS3:提供跨浏览器的CSS3能力
·Helpers:内含一系列函数
·Typography:修饰文本样式
·Utilities辅助函数,多为mixin
Browser:配置compass默认支持哪些浏览器,支持到哪个版本,一旦修改即影响其他模块的输出
-
截图
0赞 · 0采集
-
-
柚_114
2017-04-28
- ellipsis
-
截图
0赞 · 0采集
-
-
milaiduoduo
2017-03-30
- font-face的写法
-
截图
0赞 · 0采集
-
-
milaiduoduo
2017-03-30
- 按钮的写法需要在理解,时间起于16:18
-
截图
0赞 · 0采集
-
-
milaiduoduo
2017-03-30
- text-indent属性,需要理解
-
截图
0赞 · 0采集
-
-
milaiduoduo
2017-03-30
- ellipsis编译后的结果
-
截图
0赞 · 0采集