| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224 |
- /* flex */
- .center {
- display: flex;
- justify-content: center;
- align-items: center;
- }
- .flex_between {
- display: flex;
- justify-content: space-between;
- align-items: center;
- }
- .flex_l {
- display: flex;
- justify-content: flex-start;
- align-items: center;
- }
- .flex_r {
- display: flex;
- justify-content: flex-end;
- align-items: center;
- }
- .flex {
- display: flex;
- }
- .algin-center {
- align-items: center;
- }
- .flex-center {
- justify-content: center;
- }
- .flex-around {
- justify-content: space-around;
- }
- .flex-between {
- justify-content: space-between;
- }
- .flex-top {
- align-items: flex-start;
- }
- .flex-middle {
- align-items: center;
- }
- .justify-end {
- justify-content: flex-end;
- }
- .flex-bottom {
- align-items: flex-end;
- }
- .flex-column {
- flex-direction: column;
- }
- .flex-wrap {
- flex-wrap: wrap;
- }
- .flex_1 {
- flex: 1;
- }
- /* 其他 */
- .relative {
- position: relative;
- }
- .absolute {
- position: absolute;
- }
- .fixed {
- position: fixed;
- }
- .fixed-bottom {
- position: fixed;
- bottom: 0;
- left: 0;
- right: 0;
- }
- .block {
- display: block;
- }
- .boxshadow {
- box-shadow: -1px 0px 12px rgba(0, 0, 0, 0.12);
- }
- .hide {
- display: none;
- }
- .show {
- display: block;
- }
- .autowrap {
- word-wrap: break-word;
- word-break: normal;
- }
- .text-left {
- text-align: left;
- }
- .text-center {
- text-align: center;
- }
- .text-right {
- text-align: right;
- }
- .bold {
- font-weight: 600;
- }
- .over-hidden {
- overflow: hidden;
- }
- .bold {
- font-weight: 700;
- }
- .right {
- float: right;
- }
- .left {
- float: left;
- }
- view {
- box-sizing: border-box;
- }
- .text-ellipsis {
- white-space: nowrap;
- /*把文本强制显示在一行*/
- overflow: hidden;
- /*隐藏超出部分的文字*/
- text-overflow: ellipsis;
- /*超出显示省略号*/
- }
- .fixed-btn {
- position: fixed;
- width: 90rpx;
- height: 90rpx;
- bottom: 50rpx;
- right: 50rpx;
- background: #3e7ef8;
- border-radius: 50%;
- box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
- }
- /* 宽度全局样式
- ------------------------------- */
- @for $i from 10 through 200 {
- .w#{$i} {
- width: #{$i}px !important;
- }
- }
- /* 字体大小全局样式
- ------------------------------- */
- @for $i from 10 through 64 {
- .font#{$i} {
- font-size: #{$i}rpx !important;
- }
- }
- /* 外边距、内边距全局样式
- ------------------------------- */
- @for $i from 1 through 70 {
- .mt#{$i} {
- margin-top: #{$i}px !important;
- }
- .mr#{$i} {
- margin-right: #{$i}px !important;
- }
- .mb#{$i} {
- margin-bottom: #{$i}px !important;
- }
- .ml#{$i} {
- margin-left: #{$i}px !important;
- }
- .pt#{$i} {
- padding-top: #{$i}px !important;
- }
- .pr#{$i} {
- padding-right: #{$i}px !important;
- }
- .pb#{$i} {
- padding-bottom: #{$i}px !important;
- }
- .pl#{$i} {
- padding-left: #{$i}px !important;
- }
- }
|