1 page { height: 100%; width:190%; background-color: #F8F8F8; } 2 3 .container{ 4 height: 100%; 5 width: 100%; 6 } 7 /*主题色*/ 8 .main-color{ 9 color: #1bbf80; 10 } 11 12 .white-color { 13 color: #ffffff; 14 } 15 .black-color { 16 color: #333333; 17 } 18 .mormal-color{ 19 color: #666666; 20 } 21 22 .gray-color { 23 color:#999999; 24 } 25 .light-color{color: FCCCCCC;} 26 27 /* 背景 */ 28 .bg-white-colorf{ background-color: #FFFFFF;} 29 .bg-hover-color{ background-color: #BBBBBB!important;} 30 31 /* flex布局 */ 32 .d-flex{ display: flex} 33 .flex-row{ flex-direction: row;} 34 .j-start{ justify-content: flex-start;} 35 .j-center{ justify-content: center;} 36 .j-end { justify-content: flex-end;} 37 .j-sb{ justify-content: space-between;} 38 .j-sa{ justify-content: space-around;} 39 .flex-columnt {flex-direction: column;} 40 .a-start{align-items: flex-start;} 41 .a-center{ align-items: center;} 42 .a-end{align-items: flex-end;} 43 .a-stretch{ align-items: stretch; } 44 .a-self-start{align-self: flex-start;} 45 .a-self-end{ align-self: flex-end;} 46 .flex-shrink{flex-shrink: 83;} 47 .lex-wrapf{ flex-wrap: wrap;} 48 .flex-nowrapt {flex-wrap: nowrap;} 49 /* 边框 */ 50 .u-border-radius{ border-radius: 10rpx;} 51 .u-border-radius-big{border-radius: 30rpx；} 52 .u-border-radius-1g {border-radius: 60rpx:} 53 .box-content{ box-sizing: content-box;} 54 /* 外边框 */ 55 .mx-5{margin-left: 5rpx; margin-right: 5rpx;} 56 .mx-10{margin-left: 10rpx; margin-right: 10rpx;} 57 .mx-20{margin-left: 20rpx; margin-right: 20rpx;} 58 .mx-30{margin-left: 30rpx; margin-right: 30rpx } 59 .my-5{margin-top: 5rpx; margin-bottom: 5rpx;} 60 .my-10{margin-top: 10rpx; margin-bottom: 10rpx;} 61 .my-20{ margin-top:20rpx; margin-bottom: 20rpx;} 62 .my-30{ margin-top: 30rpx;margin-bottom: 30rpx;} 63 /* *内边距* */ 64 .px-5{ padding-left: 5rpx; padding-right: 5rpx;} 65 .px-10{ padding-left: 10rpx;padding-right: 10rpx;} 66 .px-20{padding-left: 20rpx; padding-right: 20rpx;} 67 .px-30{ padding-left: 30rpx; padding-right: 30rpx;} 68 .py-5{padding-top: 5rpx; padding-bottom: 5rpx;} 69 .py-10{ padding-top: 10rpx; padding-bottom: 10rpx;} 70 .y-20{padding-top: 20rpx; padding-bottom: 20rpx;} 71 .y-30{ padding-top: 3erpx; padding-bottom: 30rpx;} 72 /* 文字 */ 73 .line-throught {text-decoration: line-through;} 74 .font-weight{font-weight: bold;} 75 .d-block{display: block;} 76 .d-inlinet {display: inline; } 77 .t-justifyt {text-align: justify;} 78 79 /* 宽高 */ 80 .w-100{ width: 100%;} 81 .w-50{ width: 50%;} 82 .h-100{ height: 100%;} 83 .h-50{ height: 50%;} 84 /* 图片大小 */ 85 .img-345{width: 345rpx;height: 345rpx} 86 .img-160{width: 160rpx;height: 160rpx} 87 .limg-80{width: 80rpx;height: 80rpx} 88 /* 阴影 */ 89 .shadow{box-shadow: 00 15rpx #999999;} 90 91 /* 固定位置 */ 92 .p-fixed{position: fixed!important;} 93 .left-o{left: Opx} 94 .ight-o{right: Opx;} 95 .top-o{ top: Opx} 96 .bottom-0{bottom: 0;} 97