• SCSS引入通用SCSS


    新建通用common.scss

    .empty {
        margin-top: 100rpx;
        text-align: center;
        .empty-img {
             220rpx;
            height: 175rpx;
        }
        .empty-text {
            font-size: 20rpx;
            color: #999999;
        }
    }
    
    

    引入

    @import '../../common/scss/common.scss';
    Page {
        margin-bottom: 50rpx;
        
    }
    
    .product-item {
         690rpx;
        height: 240rpx;
        margin: 30rpx auto 0 auto;
        margin-left: 30rpx;
        // border: 1px solid red;
        background: rgba(255, 255, 255, 1);
        box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(4, 0, 0, 0.08);
        border-radius: 16rpx;
        display: flex;
        justify-content: space-between;
        .left {
             240rpx;
            margin-top: 20rpx;
            margin-left: 20rpx;
            .left-img {
                 200rpx;
                height: 200rpx;
            }
        }
    
        .right {
            margin-top: 20rpx;
            margin-left: -20rpx;
            height: 200rpx;
             450rpx;
            // border:1px solid blue;
            .title {
                margin-top: 20rpx;
                font-size: 32rpx;
                font-weight: bold;
                color: rgba(34, 34, 34, 1);
                line-height: 32rpx;
            }
            .sub-title {
                margin-top: 20rpx;
                font-size: 24rpx;
                font-weight: 500;
                color: rgba(102, 102, 102, 1);
                line-height: 32rpx;
            }
    
            .price {
                margin-top: 30rpx;
                display: flex;
                justify-content: space-between;
                margin-right: 20rpx;
                .origin-price {
                    min- 130rpx;
                    font-size: 32rpx;
                    font-weight: bold;
                    color: rgba(244, 65, 65, 1);
                    line-height: 32rpx;
                    display: flex;
                    .yuan {
                        font-size: 26rpx;
                        font-weight: bold;
                        color: rgba(244, 65, 65, 1);
                        line-height: 26rpx;
                    }
                }
    
                .vip-price {
                    font-size: 24rpx;
                    font-weight: 500;
                    color: rgba(244, 65, 65, 1);
                    line-height: 30rpx;
                    display: flex;
                    .tag {
                        color: rgba(51, 51, 51, 1);
                    }
                }
            }
        }
    }
    

    这样,就不用重复的写SCSS了。

  • 相关阅读:
    [swustoj 243] 又是一年CET46
    [转] 解析Qt资源文件使用
    [转] Qt 多线程学习
    USACO全部测试数据
    [HUD 1195] Open the Lock
    Vue-cli+webpack单页模式详解(转)
    关于vs code终端执行webpack命令报错问题(转)
    git使用相关记录
    关于flex布局兼容
    canvas绘画交叉波浪
  • 原文地址:https://www.cnblogs.com/jiqing9006/p/12893102.html
Copyright © 2020-2023  润新知