uni-app 样式 - rpx & vw & sass

1. rpx: 小程序的单位 750rpx = 屏幕宽度

<view class="rpx">rpx</view>

<style>
    .rpx {
        width: 750rpx;
        height: 100px;
    }
</style>

# view 宽度为屏幕宽度

2. vw: h5单位 100vw = 屏幕宽度, 100vh = 屏幕高度

<view class="vw">vw</view>

<style>
    .vw {
        width: 50vw;
        height: 100px;
    }
</style>

# view 宽度为屏幕宽度的一半

3. sass嵌套结构

3.1 安装sass依赖 npm i node-sass sass-loader

3.2 使用sass

<view class="sass">sass</view>

<style lang="scss"> # 重点！！！
    .content {
        .sass {
            background-color: red;
            color: $uni-color-primary; # 来自 uni.scss 文件
        }
    }
</style>