Css PX-REM mixin仅用于字体大小调整
因此,在使用rem单元时,我使用此mixin生成px值回退:Css PX-REM mixin仅用于字体大小调整,css,sass,mixins,Css,Sass,Mixins,因此,在使用rem单元时,我使用此mixin生成px值回退: @function fix8_unit_to_px($val) { @if unitless($val) { @if $val == 0 { @return $val } @else { @return $val * 10+px }; } @else { @return $val}; } @function fix8_un
@function fix8_unit_to_px($val) {
@if unitless($val) {
@if $val == 0 {
@return $val
} @else {
@return $val * 10+px
};
} @else { @return $val};
}
@function fix8_unit_to_rem($val) {
@if unitless($val) {
@if $val == 0 {
@return $val
} @else {
@return $val+rem
};
} @else { @return $val};
}
@mixin rem($prop, $val...) {
$n: length($val);
$i: 1;
$px-list: ();
$rem-list: ();
@while $i <= $n {
$px-list: append($px-list, fix8_unit_to_px(nth($val, $i)));
$rem-list: append($rem-list, fix8_unit_to_rem(nth($val, $i)));
$i: $i + 1;
}
@if $px-list == $rem-list { /* 8 */
#{$prop}: $px-list; /* 9 */
} @else {
#{$prop}: $px-list; /* 9 */
#{$prop}: $rem-list; /* 9 */
}
}
返回
font-sizing: 14px;
font-sizing: 1.4rem;
margin-top: 1.4rem;
但是,如果我将其用于除字体大小以外的任何其他用途,它只返回rem值:
@include rem(margin-top, 1.4);
返回
font-sizing: 14px;
font-sizing: 1.4rem;
margin-top: 1.4rem;
为什么会发生这种情况?无法重现:这可能是Sass或ruby的问题吗?所以ConfusedSassMester使用的是Ruby版的Sass…我用Grunt和Gulp对它进行了测试,得到了相同的结果,所以不可能是他们。我的Sass verison是3.4.5(选择性史蒂夫),这也不应该成为问题。我能想到的唯一可能是Ruby(sassmeister使用Ruby 2.0.0,我运行的是2.1.1p76)。嗯