lg_frontend/assets/styles/mixin.less

75 lines
1.5 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

//表单元素垂直居中对齐(也可设置顶对齐,底对齐)
.form-element-v-align(@alignment: middle){
display: inline-block;
vertical-align: @alignment;
*vertical-align: auto;
*display: inline;
zoom: 1;
}
//水平居中
.horizontal-center(){
margin-left: auto;
margin-right: auto;
}
//绝对居中(相对于固定宽高的容器)
.absolute-center(@width, @height){
position: absolute;
left: 50%;
top: 50%;
margin-left: -(@width / 2);
margin-top: -(@height / 2);
width: @width;
height: @height;
}
//浮动主要针对PC端了...
.float(@side: left){
float: @side;
_display: inline;
}
//清除浮动(其实很多时候clear-fix也被提取为单类使用)
.clear-fix(){
*zoom: 1;
&:before,
&:after {
content: "";
display: table;
clear: both;
overflow: hidden;
}
}
//截取文本(仅针对单行)
.text-single-line-ellipsis(@height, @line-height, @width: auto){
width: @width;
height: @height;
line-height: @line-height;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
//设置透明度
.opacity(@val){
filter: alpha(opacity=@val);
opacity: @val / 100;
}
//不可用状态
.disabled(@bgColor:#e6e6e6, @textColor:#ababab){
background-color: @bgColor !important;
color: @textColor !important;
cursor: not-allowed !important;
}
//最小高度主要针对PC端了...
.min-height(@height){
min-height: @height;
height: auto !important;
_height: @height;
}