vw可以使用在低端手机浏览器上吗
貌似不行 但是你们一直误解了一个问题
加上
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
基本上android绝大多数手机 宽度都变成360
所以废话不多说 上sass代码
////
/// This is a poster comment.
/// It will apply annotations to all items from file.
/// @group com.zhilizhiliui.framework.sass.common
/// @author andypinet
////
/// 全局变量
$com-zhilizhiliui-framework-sass-common-vw: (
'base': 360
) !global;
/// @access public
/// @example scss - com-zhilizhiliui-framework-sass-common-vw-by-value function
/// com-zhilizhiliui-framework-sass-common-vw-by-value(100)
/// // (360px, 100vw)
/// 返回对值得兼容处理
@function com-zhilizhiliui-framework-sass-common-vw-by-value($value) {
$base: map-deep-get($com-zhilizhiliui-framework-sass-common-vw, "base");
@return ($value * $base / 100 + 0px, $value + 0vw);
}
/// @access public
/// @example scss - com-zhilizhiliui-framework-sass-common-vw-by-value function
/// com-zhilizhiliui-framework-sass-common-vw-by-value(width, 100)
/// // width: 360px,
/// // width: 100vw
/// 通过一个css prop和其值 生成一个兼容vw的css
@mixin com-zhilizhiliui-framework-sass-common-vw-by-value($prop, $value) {
$base: map-deep-get($com-zhilizhiliui-framework-sass-common-vw, "base");
$result: com-zhilizhiliui-framework-sass-common-vw-by-value($value);
#{$prop}: nth($result, 1);
#{$prop}: nth($result, 2);
}
/// @access public
/// @example scss - com-zhilizhiliui-framework-sass-common-vw-by-value function
/// com-zhilizhiliui-framework-sass-common-vw-by-value((width: 100, height: 100))
/// // width: 360px,
/// // width: 100vw,
/// // height: 360px,
/// // height: 100vw,
/// 通过一个css map 生成一个兼容vw的css
@mixin com-zhilizhiliui-framework-sass-common-vw-by-map($map) {
@each $prop, $value in $map {
@include com-zhilizhiliui-framework-sass-common-vw-by-value($prop, $value);
}
}
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。