@charset "utf-8";
@import "compass/css3/inline-block";
@import "compass/css3/border-radius";
@import "compass/utilities/sprites";
@import "compass/utilities/general";
@mixin position($top,$right,$bottom,$left) {
top: $top;
right: $right;
bottom: $bottom;
left: $left;
}
//尺寸
@mixin mySize($width,$height:$width) {
width: $width;
height: $height;
}
/*行高,兼容IE8*/
@mixin lineHeight($value) {
line-height: $value;
line-height: $value \9
;
line-height: $value \0
;
}
//背景透明,文字不透明。兼容IE8
@mixin betterTransparentize($color, $alpha) {
$c: rgba($color, $alpha);
$ie_c: ie_hex_str($c);
background: rgba($color, 1);
background: $c;
background: transparent \9
;
zoom: 1;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#{$ie_c}, endColorstr=#{$ie_c});
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#{$ie_c}, endColorstr=#{$ie_c})";
}
//添加浏览器前缀
@mixin browserPrefix($propertyName,$value) {
@each $prefix in -webkit-, -moz-, -ms-, -o-, '' {
#{$prefix}#{$propertyName}: $value;
}
}
//最小高度
@mixin minHeight($height) {
min-height: $height;
height: auto !important;
@if $legacy-support-for-ie {
_height: $height;
}
}
//固定宽度子元素,水平垂直居中
@mixin center($width:null,$height:null) {
@if $width and $height {
position: absolute;
left: 50%;
top: 50%;
display: block;
margin-left: -($width/2);
margin-top: -($height/2);
}
//@if not $width and not $height {
// @include browserPrefix(transform,translate(-50%, -50%));
//} @else if $width and $height {
// margin: -($width / 2) #{0 0} -($height / 2);
//} @else if not $height {
// width: $width;
// margin-left: -($width / 2);
// @include browserPrefix(transform,translateY(-50%));
//} @else {
// margin-top: -($height / 2);
// @include browserPrefix(transform,translateX(-50%));
//}
}
//圆角,兼容IE8
@mixin radius($value) {
@include border-radius($value);
-ms-behavior: url(./css/PIE-1.0.0/PIE.htc);
} 0
0
相关文章
css 框架中的 Bulma_使用 Bulma 实现简洁的响应式布局
css 工具中的 SASS 与 LESS_选择哪种 CSS 预处理器
css 不知道哪些工具常用怎么办_了解主流 css 工具与框架
css 样式写起来太慢怎么办_使用 css 预处理工具提升开发效率
css响应式断点不好维护怎么办_通过sass变量集中管理断点
本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门AI工具
相关专题
Java 桌面应用开发(JavaFX 实战)
本专题系统讲解 Java 在桌面应用开发领域的实战应用,重点围绕 JavaFX 框架,涵盖界面布局、控件使用、事件处理、FXML、样式美化(CSS)、多线程与UI响应优化,以及桌面应用的打包与发布。通过完整示例项目,帮助学习者掌握 使用 Java 构建现代化、跨平台桌面应用程序的核心能力。
37
2026.01.14
热门下载
精品课程
相关推荐
/
热门推荐
/
最新课程
最新文章








