compass General 常用api学习[Sass和compass学习笔记]
2020-12-13 02:33
标签:style class blog code http color compass 中一些常用api 包括一些浏览器hack @import "compass/utilities/general" Clearfix 是用来清除浮动 float 造成的内容问题,以前用clear 方法可以解决,通过查看Clearfix
的源码发现对与高版本的浏览器其实已经可以不用了 用overflow 就可以了 而对于低版本的浏览器 例如ie6 还是需要clear的 compass 提供了api pie-clearfix 来解决这个问题 float 提供 相关的hack 例如ie下双倍浮动间距问题 调用 api 即可 float($side) 这里准备了一些常用的准对浏览器的bug的hack has-layout($approach)
参数为 zoom
或 block bang-hack($property,
$value, $ie6-value) 这个是写给ie6css 属性的快捷方式 这里准备了最小宽度和最小高度 重置浏览器默认样式 @import "compass/utilities/general/reset" 这个坑爹的名字 根本就不知道干啥的 我试了试 才知道是这个效果 compass General 常用api学习[Sass和compass学习笔记],搜素材,soscw.com compass General 常用api学习[Sass和compass学习笔记] 标签:style class blog code http color 原文地址:http://www.cnblogs.com/qqloving/p/3773557.htmlClearfix
@mixin clearfix {
overflow: hidden;
@include has-layout;
}
@mixin pie-clearfix {
&:after {
content:
""
;
display: table;
clear: both;
}
@include has-layout;
}
Float
Hacks
@mixin bang-hack($property, $value, $ie6-value) {
@
if
$legacy-support-
for
-ie6 {
#{$property}: #{$value} !important;
#{$property}: #{$ie6-value};
}
}
Minimum
min-height(
$value
)
min-width(
$value
)
有很多人可能对span div 设置
min-width 不起作用 设置 display: inline-block;
后即可
Reset
Tag Cloud
class
=
"mycloudtag"
>
class
=
"xxs"
>1
class
=
"xs"
>2
class
=
"s"
>3
class
=
"l"
>4
class
=
"xl"
>5
class
=
"xxl"
>6
.mycloudtag{
@include tag-cloud()
}
文章标题:compass General 常用api学习[Sass和compass学习笔记]
文章链接:http://soscw.com/essay/25825.html