|
|
@@ -1,715 +1,2000 @@
|
|
|
/* 动画 */
|
|
|
-@keyframes ani-breathing { from { transform: scale(.85);} to { transform: scale(1);} }
|
|
|
-@keyframes ani-move-to-right { 0%, 50% { left: -100%; } 100% { left: 100%; } }
|
|
|
-@keyframes ani-cursor { 0% { opacity: 0;} 100% { opacity: 1;} }
|
|
|
+@keyframes ani-breathing {
|
|
|
+ from {
|
|
|
+ transform: scale(0.85);
|
|
|
+ }
|
|
|
+ to {
|
|
|
+ transform: scale(1);
|
|
|
+ }
|
|
|
+}
|
|
|
+@keyframes ani-move-to-right {
|
|
|
+ 0%,
|
|
|
+ 50% {
|
|
|
+ left: -100%;
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ left: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+@keyframes ani-cursor {
|
|
|
+ 0% {
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+}
|
|
|
/* 呼吸按钮 */
|
|
|
-.ani-breathing { animation: ani-breathing .6s ease-out alternate infinite; }
|
|
|
+.ani-breathing {
|
|
|
+ animation: ani-breathing 0.6s ease-out alternate infinite;
|
|
|
+}
|
|
|
/* 高光动画 */
|
|
|
-.ani-move-to-right { animation: ani-move-to-right 2s ease-out infinite; }
|
|
|
+.ani-move-to-right {
|
|
|
+ animation: ani-move-to-right 2s ease-out infinite;
|
|
|
+}
|
|
|
/** 自定义光标闪烁 **/
|
|
|
-.ani-cursor { animation: ani-cursor 0.5s linear alternate infinite; }
|
|
|
+.ani-cursor {
|
|
|
+ animation: ani-cursor 0.5s linear alternate infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@font-face {
|
|
|
+ font-family: "DIN-Bold";
|
|
|
+ src: url("/fonts/din-bold.otf");
|
|
|
+}
|
|
|
+@font-face {
|
|
|
+ font-family: "DIN-Regular";
|
|
|
+ src: url("/fonts/din-regular.otf");
|
|
|
+}
|
|
|
+@font-face {
|
|
|
+ font-family: "DIN-Black";
|
|
|
+ src: url("/fonts/DIN-Black.otf");
|
|
|
+}
|
|
|
+/* 字体名称 */
|
|
|
+.ff-DIN-Bold {
|
|
|
+ font-family: "DIN-Bold";
|
|
|
+}
|
|
|
+.ff-DIN-Black {
|
|
|
+ font-family: "DIN-Black";
|
|
|
+}
|
|
|
+.ff-DIN-Regular {
|
|
|
+ font-family: "DIN-Regular";
|
|
|
+}
|
|
|
+
|
|
|
+/* H5 */
|
|
|
+.tab-page {
|
|
|
+ padding-bottom: calc(var(--van-tabbar-height) + env(safe-area-inset-bottom));
|
|
|
+}
|
|
|
+.page {
|
|
|
+ padding-bottom: env(safe-area-inset-bottom);
|
|
|
+}
|
|
|
+.page,
|
|
|
+.tab-page {
|
|
|
+ width: 100%;
|
|
|
+ min-height: 100vh;
|
|
|
+ background-color: #f9f9f9;
|
|
|
+ font-family: PingFangSC-Regular, PingFang SC;
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: flex-start;
|
|
|
+ .sub-page {
|
|
|
+ padding-bottom: env(safe-area-inset-bottom);
|
|
|
+ position: absolute;
|
|
|
+ z-index: 1;
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ background-color: #f9f9f9;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* 公共样式 */
|
|
|
+* {
|
|
|
+ touch-action: pan-y;
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+a {
|
|
|
+ text-decoration: none !important;
|
|
|
+}
|
|
|
+img {
|
|
|
+ max-width: 100% !important;
|
|
|
+ width: 100%;
|
|
|
+ vertical-align: middle;
|
|
|
+}
|
|
|
+input {
|
|
|
+ outline: none;
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+.coming-soon {
|
|
|
+ font-size: 32px;
|
|
|
+ text-align: center;
|
|
|
+ padding-top: 100px;
|
|
|
+ color: #778899;
|
|
|
+ letter-spacing: 2px;
|
|
|
+}
|
|
|
+/** 背景尺寸 */
|
|
|
+.bg-all {
|
|
|
+ background-size: 100% 100% !important;
|
|
|
+}
|
|
|
+.bg-cover {
|
|
|
+ background-size: cover !important;
|
|
|
+}
|
|
|
+.bg-contain {
|
|
|
+ background-size: contain !important;
|
|
|
+}
|
|
|
+
|
|
|
+/** 字体颜色 */
|
|
|
+
|
|
|
+.color-222222 {
|
|
|
+ color: #222222;
|
|
|
+}
|
|
|
+.color-333333 {
|
|
|
+ color: #333333;
|
|
|
+}
|
|
|
+.color-444444 {
|
|
|
+ color: #444444;
|
|
|
+}
|
|
|
+.color-555555 {
|
|
|
+ color: #555555;
|
|
|
+}
|
|
|
+.color-666666 {
|
|
|
+ color: #666666;
|
|
|
+}
|
|
|
+.color-777777 {
|
|
|
+ color: #777777;
|
|
|
+}
|
|
|
+.color-888888 {
|
|
|
+ color: #888888;
|
|
|
+}
|
|
|
+.color-999999 {
|
|
|
+ color: #999999;
|
|
|
+}
|
|
|
+.color-FFFFFF {
|
|
|
+ color: #ffffff;
|
|
|
+}
|
|
|
+
|
|
|
+/** 背景颜色 */
|
|
|
+.bg-F9F9F9 {
|
|
|
+ background-color: #f9f9f9;
|
|
|
+}
|
|
|
+.bg-EEEEEE {
|
|
|
+ background-color: #eeeeee;
|
|
|
+}
|
|
|
+.bg-DEDEDE {
|
|
|
+ background-color: #dedede;
|
|
|
+}
|
|
|
+.bg-FFFFFF {
|
|
|
+ background-color: #ffffff;
|
|
|
+}
|
|
|
+
|
|
|
+/** 尺寸相关 */
|
|
|
+.w-min-0 {
|
|
|
+ min-width: 0;
|
|
|
+}
|
|
|
+.w-0 {
|
|
|
+ width: 0;
|
|
|
+}
|
|
|
+.w-100 {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.w-50 {
|
|
|
+ width: 50%;
|
|
|
+}
|
|
|
+.w-auto {
|
|
|
+ width: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.h-100 {
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+.h-auto {
|
|
|
+ height: auto;
|
|
|
+}
|
|
|
+.h-min-100 {
|
|
|
+ min-height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.vw-100 {
|
|
|
+ width: 100vw;
|
|
|
+}
|
|
|
+.vh-100 {
|
|
|
+ height: 100vh;
|
|
|
+}
|
|
|
+
|
|
|
+/** 显示类型 **/
|
|
|
+.d-block {
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+.d-inline {
|
|
|
+ display: inline;
|
|
|
+}
|
|
|
+.d-inline-block {
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.d-flex {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.flex-1 {
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
+.flex-wrap {
|
|
|
+ flex-wrap: wrap;
|
|
|
+}
|
|
|
+.flex-h-between {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flex-h-center {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flex-h-around {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flex-h-start {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flex-h-end {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flex-v-center {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flex-v {
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.flex-h {
|
|
|
+ flex-direction: row;
|
|
|
+}
|
|
|
+.flex-shrink {
|
|
|
+ flex-shrink: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.justify-content-start {
|
|
|
+ justify-content: flex-start;
|
|
|
+}
|
|
|
+.justify-content-end {
|
|
|
+ justify-content: flex-end;
|
|
|
+}
|
|
|
+.justify-content-center {
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+.justify-content-between {
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+.justify-content-around {
|
|
|
+ justify-content: space-around;
|
|
|
+}
|
|
|
+
|
|
|
+.align-items-start {
|
|
|
+ align-items: flex-start;
|
|
|
+}
|
|
|
+.align-items-end {
|
|
|
+ align-items: flex-end;
|
|
|
+}
|
|
|
+.align-items-center {
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.align-items-baseline {
|
|
|
+ align-items: baseline;
|
|
|
+}
|
|
|
+/* 盒子模型 - 间距 */
|
|
|
+
|
|
|
+.p-1 {
|
|
|
+ padding-top: 1px;
|
|
|
+ padding-right: 1px;
|
|
|
+ padding-bottom: 1px;
|
|
|
+ padding-left: 1px;
|
|
|
+}
|
|
|
+.p-2 {
|
|
|
+ padding-top: 2px;
|
|
|
+ padding-right: 2px;
|
|
|
+ padding-bottom: 2px;
|
|
|
+ padding-left: 2px;
|
|
|
+}
|
|
|
+.p-3 {
|
|
|
+ padding-top: 3px;
|
|
|
+ padding-right: 3px;
|
|
|
+ padding-bottom: 3px;
|
|
|
+ padding-left: 3px;
|
|
|
+}
|
|
|
+.p-4 {
|
|
|
+ padding-top: 4px;
|
|
|
+ padding-right: 4px;
|
|
|
+ padding-bottom: 4px;
|
|
|
+ padding-left: 4px;
|
|
|
+}
|
|
|
+.p-6 {
|
|
|
+ padding-top: 6px;
|
|
|
+ padding-right: 6px;
|
|
|
+ padding-bottom: 6px;
|
|
|
+ padding-left: 6px;
|
|
|
+}
|
|
|
+.p-8 {
|
|
|
+ padding-top: 8px;
|
|
|
+ padding-right: 8px;
|
|
|
+ padding-bottom: 8px;
|
|
|
+ padding-left: 8px;
|
|
|
+}
|
|
|
+.p-10 {
|
|
|
+ padding-top: 10px;
|
|
|
+ padding-right: 10px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ padding-left: 10px;
|
|
|
+}
|
|
|
+.p-12 {
|
|
|
+ padding-top: 12px;
|
|
|
+ padding-right: 12px;
|
|
|
+ padding-bottom: 12px;
|
|
|
+ padding-left: 12px;
|
|
|
+}
|
|
|
+.p-15 {
|
|
|
+ padding-top: 15px;
|
|
|
+ padding-right: 15px;
|
|
|
+ padding-bottom: 15px;
|
|
|
+ padding-left: 15px;
|
|
|
+}
|
|
|
+.p-16 {
|
|
|
+ padding-top: 16px;
|
|
|
+ padding-right: 16px;
|
|
|
+ padding-bottom: 16px;
|
|
|
+ padding-left: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.px-2 {
|
|
|
+ padding-left: 2px;
|
|
|
+ padding-right: 2px;
|
|
|
+}
|
|
|
+.px-3 {
|
|
|
+ padding-left: 3px;
|
|
|
+ padding-right: 3px;
|
|
|
+}
|
|
|
+.px-4 {
|
|
|
+ padding-left: 4px;
|
|
|
+ padding-right: 4px;
|
|
|
+}
|
|
|
+.px-5 {
|
|
|
+ padding-left: 5px;
|
|
|
+ padding-right: 5px;
|
|
|
+}
|
|
|
+.px-6 {
|
|
|
+ padding-left: 6px;
|
|
|
+ padding-right: 6px;
|
|
|
+}
|
|
|
+.px-7 {
|
|
|
+ padding-left: 7px;
|
|
|
+ padding-right: 7px;
|
|
|
+}
|
|
|
+.px-8 {
|
|
|
+ padding-left: 8px;
|
|
|
+ padding-right: 8px;
|
|
|
+}
|
|
|
+.px-9 {
|
|
|
+ padding-left: 9px;
|
|
|
+ padding-right: 9px;
|
|
|
+}
|
|
|
+.px-10 {
|
|
|
+ padding-left: 10px;
|
|
|
+ padding-right: 10px;
|
|
|
+}
|
|
|
+.px-11 {
|
|
|
+ padding-left: 11px;
|
|
|
+ padding-right: 11px;
|
|
|
+}
|
|
|
+.px-12 {
|
|
|
+ padding-left: 12px;
|
|
|
+ padding-right: 12px;
|
|
|
+}
|
|
|
+.px-13 {
|
|
|
+ padding-left: 13px;
|
|
|
+ padding-right: 13px;
|
|
|
+}
|
|
|
+.px-15 {
|
|
|
+ padding-left: 15px;
|
|
|
+ padding-right: 15px;
|
|
|
+}
|
|
|
+.px-16 {
|
|
|
+ padding-left: 16px;
|
|
|
+ padding-right: 16px;
|
|
|
+}
|
|
|
+.px-17 {
|
|
|
+ padding-left: 17px;
|
|
|
+ padding-right: 17px;
|
|
|
+}
|
|
|
+.px-18 {
|
|
|
+ padding-left: 18px;
|
|
|
+ padding-right: 18px;
|
|
|
+}
|
|
|
+.px-20 {
|
|
|
+ padding-left: 20px;
|
|
|
+ padding-right: 20px;
|
|
|
+}
|
|
|
+.px-22 {
|
|
|
+ padding-left: 22px;
|
|
|
+ padding-right: 22px;
|
|
|
+}
|
|
|
+.px-24 {
|
|
|
+ padding-left: 24px;
|
|
|
+ padding-right: 24px;
|
|
|
+}
|
|
|
+.px-25 {
|
|
|
+ padding-left: 25px;
|
|
|
+ padding-right: 25px;
|
|
|
+}
|
|
|
+.px-27 {
|
|
|
+ padding-left: 27px;
|
|
|
+ padding-right: 27px;
|
|
|
+}
|
|
|
+.px-28 {
|
|
|
+ padding-left: 28px;
|
|
|
+ padding-right: 28px;
|
|
|
+}
|
|
|
+.px-30 {
|
|
|
+ padding-left: 30px;
|
|
|
+ padding-right: 30px;
|
|
|
+}
|
|
|
+.px-33 {
|
|
|
+ padding-left: 33px;
|
|
|
+ padding-right: 33px;
|
|
|
+}
|
|
|
+.px-38 {
|
|
|
+ padding-left: 38px;
|
|
|
+ padding-right: 38px;
|
|
|
+}
|
|
|
+.px-40 {
|
|
|
+ padding-left: 40px;
|
|
|
+ padding-right: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+.py-1 {
|
|
|
+ padding-top: 1px;
|
|
|
+ padding-bottom: 1px;
|
|
|
+}
|
|
|
+.py-2 {
|
|
|
+ padding-top: 2px;
|
|
|
+ padding-bottom: 2px;
|
|
|
+}
|
|
|
+.py-3 {
|
|
|
+ padding-top: 3px;
|
|
|
+ padding-bottom: 3px;
|
|
|
+}
|
|
|
+.py-4 {
|
|
|
+ padding-top: 4px;
|
|
|
+ padding-bottom: 4px;
|
|
|
+}
|
|
|
+.py-6 {
|
|
|
+ padding-top: 6px;
|
|
|
+ padding-bottom: 6px;
|
|
|
+}
|
|
|
+.py-8 {
|
|
|
+ padding-top: 8px;
|
|
|
+ padding-bottom: 8px;
|
|
|
+}
|
|
|
+.py-9 {
|
|
|
+ padding-top: 9px;
|
|
|
+ padding-bottom: 9px;
|
|
|
+}
|
|
|
+.py-10 {
|
|
|
+ padding-top: 10px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+}
|
|
|
+.py-11 {
|
|
|
+ padding-top: 11px;
|
|
|
+ padding-bottom: 11px;
|
|
|
+}
|
|
|
+.py-12 {
|
|
|
+ padding-top: 12px;
|
|
|
+ padding-bottom: 12px;
|
|
|
+}
|
|
|
+.py-13 {
|
|
|
+ padding-top: 13px;
|
|
|
+ padding-bottom: 13px;
|
|
|
+}
|
|
|
+.py-14 {
|
|
|
+ padding-top: 14px;
|
|
|
+ padding-bottom: 14px;
|
|
|
+}
|
|
|
+.py-15 {
|
|
|
+ padding-top: 15px;
|
|
|
+ padding-bottom: 15px;
|
|
|
+}
|
|
|
+.py-16 {
|
|
|
+ padding-top: 16px;
|
|
|
+ padding-bottom: 16px;
|
|
|
+}
|
|
|
+.py-18 {
|
|
|
+ padding-top: 18px;
|
|
|
+ padding-bottom: 18px;
|
|
|
+}
|
|
|
+.py-20 {
|
|
|
+ padding-top: 20px;
|
|
|
+ padding-bottom: 20px;
|
|
|
+}
|
|
|
+.py-21 {
|
|
|
+ padding-top: 21px;
|
|
|
+ padding-bottom: 21px;
|
|
|
+}
|
|
|
+.py-22 {
|
|
|
+ padding-top: 22px;
|
|
|
+ padding-bottom: 22px;
|
|
|
+}
|
|
|
+.py-34 {
|
|
|
+ padding-top: 34px;
|
|
|
+ padding-bottom: 34px;
|
|
|
+}
|
|
|
+
|
|
|
+.pt-2 {
|
|
|
+ padding-top: 2px;
|
|
|
+}
|
|
|
+.pt-3 {
|
|
|
+ padding-top: 3px;
|
|
|
+}
|
|
|
+.pt-4 {
|
|
|
+ padding-top: 4px;
|
|
|
+}
|
|
|
+.pt-5 {
|
|
|
+ padding-top: 5px;
|
|
|
+}
|
|
|
+.pt-6 {
|
|
|
+ padding-top: 6px;
|
|
|
+}
|
|
|
+.pt-7 {
|
|
|
+ padding-top: 7px;
|
|
|
+}
|
|
|
+.pt-8 {
|
|
|
+ padding-top: 8px;
|
|
|
+}
|
|
|
+.pt-9 {
|
|
|
+ padding-top: 9px;
|
|
|
+}
|
|
|
+.pt-10 {
|
|
|
+ padding-top: 10px;
|
|
|
+}
|
|
|
+.pt-11 {
|
|
|
+ padding-top: 11px;
|
|
|
+}
|
|
|
+.pt-12 {
|
|
|
+ padding-top: 12px;
|
|
|
+}
|
|
|
+.pt-13 {
|
|
|
+ padding-top: 13px;
|
|
|
+}
|
|
|
+.pt-14 {
|
|
|
+ padding-top: 14px;
|
|
|
+}
|
|
|
+.pt-15 {
|
|
|
+ padding-top: 15px;
|
|
|
+}
|
|
|
+.pt-16 {
|
|
|
+ padding-top: 16px;
|
|
|
+}
|
|
|
+.pt-17 {
|
|
|
+ padding-top: 17px;
|
|
|
+}
|
|
|
+.pt-18 {
|
|
|
+ padding-top: 18px;
|
|
|
+}
|
|
|
+.pt-19 {
|
|
|
+ padding-top: 19px;
|
|
|
+}
|
|
|
+.pt-20 {
|
|
|
+ padding-top: 20px;
|
|
|
+}
|
|
|
+.pt-21 {
|
|
|
+ padding-top: 21px;
|
|
|
+}
|
|
|
+.pt-22 {
|
|
|
+ padding-top: 22px;
|
|
|
+}
|
|
|
+.pt-23 {
|
|
|
+ padding-top: 23px;
|
|
|
+}
|
|
|
+.pt-24 {
|
|
|
+ padding-top: 24px;
|
|
|
+}
|
|
|
+.pt-26 {
|
|
|
+ padding-top: 26px;
|
|
|
+}
|
|
|
+.pt-27 {
|
|
|
+ padding-top: 27px;
|
|
|
+}
|
|
|
+.pt-29 {
|
|
|
+ padding-top: 29px;
|
|
|
+}
|
|
|
+.pt-30 {
|
|
|
+ padding-top: 30px;
|
|
|
+}
|
|
|
+.pt-33 {
|
|
|
+ padding-top: 33px;
|
|
|
+}
|
|
|
+.pt-36 {
|
|
|
+ padding-top: 36px;
|
|
|
+}
|
|
|
+.pt-40 {
|
|
|
+ padding-top: 40px;
|
|
|
+}
|
|
|
+.pt-59 {
|
|
|
+ padding-top: 59px;
|
|
|
+}
|
|
|
+.pt-76 {
|
|
|
+ padding-top: 76px;
|
|
|
+}
|
|
|
+.pt-99 {
|
|
|
+ padding-top: 99px;
|
|
|
+}
|
|
|
|
|
|
+.pt-100 {
|
|
|
+ padding-top: 100px;
|
|
|
+}
|
|
|
+
|
|
|
+.pr-1 {
|
|
|
+ padding-right: 1px;
|
|
|
+}
|
|
|
+.pr-2 {
|
|
|
+ padding-right: 2px;
|
|
|
+}
|
|
|
+.pr-3 {
|
|
|
+ padding-right: 3px;
|
|
|
+}
|
|
|
+.pr-5 {
|
|
|
+ padding-right: 5px;
|
|
|
+}
|
|
|
+.pr-4 {
|
|
|
+ padding-right: 4px;
|
|
|
+}
|
|
|
+.pr-6 {
|
|
|
+ padding-right: 6px;
|
|
|
+}
|
|
|
+.pr-8 {
|
|
|
+ padding-right: 8px;
|
|
|
+}
|
|
|
+.pr-10 {
|
|
|
+ padding-right: 10px;
|
|
|
+}
|
|
|
+.pr-14 {
|
|
|
+ padding-right: 14px;
|
|
|
+}
|
|
|
+.pr-16 {
|
|
|
+ padding-right: 16px;
|
|
|
+}
|
|
|
+.pr-17 {
|
|
|
+ padding-right: 17px;
|
|
|
+}
|
|
|
+.pr-21 {
|
|
|
+ padding-right: 21px;
|
|
|
+}
|
|
|
+.pr-22 {
|
|
|
+ padding-right: 22px;
|
|
|
+}
|
|
|
+.pr-24 {
|
|
|
+ padding-right: 24px;
|
|
|
+}
|
|
|
+
|
|
|
+.pb-2 {
|
|
|
+ padding-bottom: 2px;
|
|
|
+}
|
|
|
+.pb-3 {
|
|
|
+ padding-bottom: 3px;
|
|
|
+}
|
|
|
+.pb-4 {
|
|
|
+ padding-bottom: 4px;
|
|
|
+}
|
|
|
+.pb-6 {
|
|
|
+ padding-bottom: 6px;
|
|
|
+}
|
|
|
+.pb-8 {
|
|
|
+ padding-bottom: 8px;
|
|
|
+}
|
|
|
+.pb-9 {
|
|
|
+ padding-bottom: 9px;
|
|
|
+}
|
|
|
+.pb-10 {
|
|
|
+ padding-bottom: 10px;
|
|
|
+}
|
|
|
+.pb-11 {
|
|
|
+ padding-bottom: 11px;
|
|
|
+}
|
|
|
+.pb-12 {
|
|
|
+ padding-bottom: 12px;
|
|
|
+}
|
|
|
+.pb-13 {
|
|
|
+ padding-bottom: 13px;
|
|
|
+}
|
|
|
+.pb-14 {
|
|
|
+ padding-bottom: 14px;
|
|
|
+}
|
|
|
+.pb-15 {
|
|
|
+ padding-bottom: 15px;
|
|
|
+}
|
|
|
+.pb-16 {
|
|
|
+ padding-bottom: 16px;
|
|
|
+}
|
|
|
+.pb-18 {
|
|
|
+ padding-bottom: 18px;
|
|
|
+}
|
|
|
+.pb-19 {
|
|
|
+ padding-bottom: 19px;
|
|
|
+}
|
|
|
+.pb-20 {
|
|
|
+ padding-bottom: 20px;
|
|
|
+}
|
|
|
+.pb-21 {
|
|
|
+ padding-bottom: 21px;
|
|
|
+}
|
|
|
+.pb-22 {
|
|
|
+ padding-bottom: 22px;
|
|
|
+}
|
|
|
+.pb-29 {
|
|
|
+ padding-bottom: 29px;
|
|
|
+}
|
|
|
+.pb-32 {
|
|
|
+ padding-bottom: 32px;
|
|
|
+}
|
|
|
+.pb-35 {
|
|
|
+ padding-bottom: 35px;
|
|
|
+}
|
|
|
+.pb-99 {
|
|
|
+ padding-bottom: 99px;
|
|
|
+}
|
|
|
+
|
|
|
+.pl-0 {
|
|
|
+ padding-left: 0px;
|
|
|
+}
|
|
|
+.pl-2 {
|
|
|
+ padding-left: 2px;
|
|
|
+}
|
|
|
+.pl-4 {
|
|
|
+ padding-left: 4px;
|
|
|
+}
|
|
|
+.pl-6 {
|
|
|
+ padding-left: 6px;
|
|
|
+}
|
|
|
+.pl-7 {
|
|
|
+ padding-left: 6px;
|
|
|
+}
|
|
|
+.pl-8 {
|
|
|
+ padding-left: 8px;
|
|
|
+}
|
|
|
+.pl-10 {
|
|
|
+ padding-left: 10px;
|
|
|
+}
|
|
|
+.pl-14 {
|
|
|
+ padding-left: 14px;
|
|
|
+}
|
|
|
+.pl-12 {
|
|
|
+ padding-left: 12px;
|
|
|
+}
|
|
|
+.pl-16 {
|
|
|
+ padding-left: 16px;
|
|
|
+}
|
|
|
+.pl-17 {
|
|
|
+ padding-left: 17px;
|
|
|
+}
|
|
|
+.pl-18 {
|
|
|
+ padding-left: 18px;
|
|
|
+}
|
|
|
+.pl-19 {
|
|
|
+ padding-left: 19px;
|
|
|
+}
|
|
|
+.pl-20 {
|
|
|
+ padding-left: 20px;
|
|
|
+}
|
|
|
+.pl-22 {
|
|
|
+ padding-left: 22px;
|
|
|
+}
|
|
|
+.pl-24 {
|
|
|
+ padding-left: 24px;
|
|
|
+}
|
|
|
+.pl-25 {
|
|
|
+ padding-left: 25px;
|
|
|
+}
|
|
|
+.pl-26 {
|
|
|
+ padding-left: 26px;
|
|
|
+}
|
|
|
+.pl-27 {
|
|
|
+ padding-left: 27px;
|
|
|
+}
|
|
|
+.pl-29 {
|
|
|
+ padding-left: 29px;
|
|
|
+}
|
|
|
+.pl-38 {
|
|
|
+ padding-left: 38px;
|
|
|
+}
|
|
|
+
|
|
|
+.mx-auto {
|
|
|
+ margin-left: auto;
|
|
|
+ margin-right: auto;
|
|
|
+}
|
|
|
+.mx-2 {
|
|
|
+ margin-left: 2px;
|
|
|
+ margin-right: 2px;
|
|
|
+}
|
|
|
+.mx-4 {
|
|
|
+ margin-left: 4px;
|
|
|
+ margin-right: 4px;
|
|
|
+}
|
|
|
+.mx-6 {
|
|
|
+ margin-left: 6px;
|
|
|
+ margin-right: 6px;
|
|
|
+}
|
|
|
+.mx-8 {
|
|
|
+ margin-left: 8px;
|
|
|
+ margin-right: 8px;
|
|
|
+}
|
|
|
+.mx-10 {
|
|
|
+ margin-left: 10px;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+.mx-17 {
|
|
|
+ margin-left: 17px;
|
|
|
+ margin-right: 17px;
|
|
|
+}
|
|
|
+.mx-20 {
|
|
|
+ margin-left: 20px;
|
|
|
+ margin-right: 20px;
|
|
|
+}
|
|
|
+.mx-28 {
|
|
|
+ margin-left: 28px;
|
|
|
+ margin-right: 28px;
|
|
|
+}
|
|
|
+
|
|
|
+.my-2 {
|
|
|
+ margin-top: 2px;
|
|
|
+ margin-bottom: 2px;
|
|
|
+}
|
|
|
+.my-3 {
|
|
|
+ margin-top: 3px;
|
|
|
+ margin-bottom: 3px;
|
|
|
+}
|
|
|
+.my-4 {
|
|
|
+ margin-top: 4px;
|
|
|
+ margin-bottom: 4px;
|
|
|
+}
|
|
|
+.my-6 {
|
|
|
+ margin-top: 6px;
|
|
|
+ margin-bottom: 6px;
|
|
|
+}
|
|
|
+.my-8 {
|
|
|
+ margin-top: 8px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+}
|
|
|
+.my-10 {
|
|
|
+ margin-top: 10px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+.my-12 {
|
|
|
+ margin-top: 12px;
|
|
|
+ margin-bottom: 12px;
|
|
|
+}
|
|
|
+.my-14 {
|
|
|
+ margin-top: 14px;
|
|
|
+ margin-bottom: 14px;
|
|
|
+}
|
|
|
+.my-15 {
|
|
|
+ margin-top: 15px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+}
|
|
|
+.my-16 {
|
|
|
+ margin-top: 16px;
|
|
|
+ margin-bottom: 16px;
|
|
|
+}
|
|
|
+.my-24 {
|
|
|
+ margin-top: 24px;
|
|
|
+ margin-bottom: 24px;
|
|
|
+}
|
|
|
+
|
|
|
+.mt-1 {
|
|
|
+ margin-top: 1px;
|
|
|
+}
|
|
|
+.mt-2 {
|
|
|
+ margin-top: 2px;
|
|
|
+}
|
|
|
+.mt-3 {
|
|
|
+ margin-top: 3px;
|
|
|
+}
|
|
|
+.mt-4 {
|
|
|
+ margin-top: 4px;
|
|
|
+}
|
|
|
+.mt-5 {
|
|
|
+ margin-top: 5px;
|
|
|
+}
|
|
|
+.mt-6 {
|
|
|
+ margin-top: 6px;
|
|
|
+}
|
|
|
+.mt-7 {
|
|
|
+ margin-top: 7px;
|
|
|
+}
|
|
|
+.mt-8 {
|
|
|
+ margin-top: 8px;
|
|
|
+}
|
|
|
+.mt-9 {
|
|
|
+ margin-top: 9px;
|
|
|
+}
|
|
|
+.mt-10 {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+.mt-11 {
|
|
|
+ margin-top: 11px;
|
|
|
+}
|
|
|
+.mt-12 {
|
|
|
+ margin-top: 12px;
|
|
|
+}
|
|
|
+.mt-13 {
|
|
|
+ margin-top: 13px;
|
|
|
+}
|
|
|
+.mt-14 {
|
|
|
+ margin-top: 14px;
|
|
|
+}
|
|
|
+.mt-15 {
|
|
|
+ margin-top: 15px;
|
|
|
+}
|
|
|
+.mt-16 {
|
|
|
+ margin-top: 16px;
|
|
|
+}
|
|
|
+.mt-17 {
|
|
|
+ margin-top: 17px;
|
|
|
+}
|
|
|
+.mt-18 {
|
|
|
+ margin-top: 18px;
|
|
|
+}
|
|
|
+.mt-19 {
|
|
|
+ margin-top: 19px;
|
|
|
+}
|
|
|
+.mt-20 {
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+.mt-21 {
|
|
|
+ margin-top: 21px;
|
|
|
+}
|
|
|
+.mt-22 {
|
|
|
+ margin-top: 22px;
|
|
|
+}
|
|
|
+.mt-23 {
|
|
|
+ margin-top: 23px;
|
|
|
+}
|
|
|
+.mt-24 {
|
|
|
+ margin-top: 24px;
|
|
|
+}
|
|
|
+.mt-25 {
|
|
|
+ margin-top: 25px;
|
|
|
+}
|
|
|
+.mt-26 {
|
|
|
+ margin-top: 26px;
|
|
|
+}
|
|
|
+.mt-28 {
|
|
|
+ margin-top: 28px;
|
|
|
+}
|
|
|
+.mt-29 {
|
|
|
+ margin-top: 29px;
|
|
|
+}
|
|
|
+.mt-30 {
|
|
|
+ margin-top: 30px;
|
|
|
+}
|
|
|
+.mt-31 {
|
|
|
+ margin-top: 31px;
|
|
|
+}
|
|
|
+.mt-32 {
|
|
|
+ margin-top: 32px;
|
|
|
+}
|
|
|
+.mt-34 {
|
|
|
+ margin-top: 34px;
|
|
|
+}
|
|
|
+.mt-38 {
|
|
|
+ margin-top: 38px;
|
|
|
+}
|
|
|
+.mt-39 {
|
|
|
+ margin-top: 39px;
|
|
|
+}
|
|
|
+.mt-40 {
|
|
|
+ margin-top: 40px;
|
|
|
+}
|
|
|
+.mt-41 {
|
|
|
+ margin-top: 41px;
|
|
|
+}
|
|
|
+.mt-47 {
|
|
|
+ margin-top: 47px;
|
|
|
+}
|
|
|
+.mt-50 {
|
|
|
+ margin-top: 50px;
|
|
|
+}
|
|
|
+.mt-60 {
|
|
|
+ margin-top: 60px;
|
|
|
+}
|
|
|
+.mt-99 {
|
|
|
+ margin-top: 99px;
|
|
|
+}
|
|
|
+.mt-105 {
|
|
|
+ margin-top: 105px;
|
|
|
+}
|
|
|
+
|
|
|
+.mr-2 {
|
|
|
+ margin-right: 2px;
|
|
|
+}
|
|
|
+.mr-3 {
|
|
|
+ margin-right: 3px;
|
|
|
+}
|
|
|
+.mr-4 {
|
|
|
+ margin-right: 4px;
|
|
|
+}
|
|
|
+.mr-5 {
|
|
|
+ margin-right: 5px;
|
|
|
+}
|
|
|
+.mr-6 {
|
|
|
+ margin-right: 6px;
|
|
|
+}
|
|
|
+.mr-7 {
|
|
|
+ margin-right: 7px;
|
|
|
+}
|
|
|
+.mr-8 {
|
|
|
+ margin-right: 8px;
|
|
|
+}
|
|
|
+.mr-9 {
|
|
|
+ margin-right: 9px;
|
|
|
+}
|
|
|
+.mr-10 {
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+.mr-11 {
|
|
|
+ margin-right: 11px;
|
|
|
+}
|
|
|
+.mr-12 {
|
|
|
+ margin-right: 12px;
|
|
|
+}
|
|
|
+.mr-13 {
|
|
|
+ margin-right: 13px;
|
|
|
+}
|
|
|
+.mr-14 {
|
|
|
+ margin-right: 14px;
|
|
|
+}
|
|
|
+.mr-15 {
|
|
|
+ margin-right: 15px;
|
|
|
+}
|
|
|
+.mr-16 {
|
|
|
+ margin-right: 16px;
|
|
|
+}
|
|
|
+.mr-18 {
|
|
|
+ margin-right: 18px;
|
|
|
+}
|
|
|
+.mr-20 {
|
|
|
+ margin-right: 20px;
|
|
|
+}
|
|
|
+.mr-21 {
|
|
|
+ margin-right: 21px;
|
|
|
+}
|
|
|
+.mr-25 {
|
|
|
+ margin-right: 25px;
|
|
|
+}
|
|
|
+.mr-30 {
|
|
|
+ margin-right: 30px;
|
|
|
+}
|
|
|
+.mr-35 {
|
|
|
+ margin-right: 35px;
|
|
|
+}
|
|
|
+.mr-40 {
|
|
|
+ margin-right: 40px;
|
|
|
+}
|
|
|
+.mr-79 {
|
|
|
+ margin-right: 79px;
|
|
|
+}
|
|
|
+
|
|
|
+.mb-0 {
|
|
|
+ margin-bottom: 0px;
|
|
|
+}
|
|
|
+.mb-1 {
|
|
|
+ margin-bottom: 1px;
|
|
|
+}
|
|
|
+.mb-2 {
|
|
|
+ margin-bottom: 2px;
|
|
|
+}
|
|
|
+.mb-3 {
|
|
|
+ margin-bottom: 3px;
|
|
|
+}
|
|
|
+.mb-4 {
|
|
|
+ margin-bottom: 4px;
|
|
|
+}
|
|
|
+.mb-5 {
|
|
|
+ margin-bottom: 5px;
|
|
|
+}
|
|
|
+.mb-6 {
|
|
|
+ margin-bottom: 6px;
|
|
|
+}
|
|
|
+.mb-7 {
|
|
|
+ margin-bottom: 7px;
|
|
|
+}
|
|
|
+.mb-8 {
|
|
|
+ margin-bottom: 8px;
|
|
|
+}
|
|
|
+.mb-9 {
|
|
|
+ margin-bottom: 9px;
|
|
|
+}
|
|
|
+.mb-10 {
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+.mb-11 {
|
|
|
+ margin-bottom: 11px;
|
|
|
+}
|
|
|
+.mb-12 {
|
|
|
+ margin-bottom: 12px;
|
|
|
+}
|
|
|
+.mb-13 {
|
|
|
+ margin-bottom: 13px;
|
|
|
+}
|
|
|
+.mb-14 {
|
|
|
+ margin-bottom: 14px;
|
|
|
+}
|
|
|
+.mb-15 {
|
|
|
+ margin-bottom: 15px;
|
|
|
+}
|
|
|
+.mb-16 {
|
|
|
+ margin-bottom: 16px;
|
|
|
+}
|
|
|
+.mb-17 {
|
|
|
+ margin-bottom: 17px;
|
|
|
+}
|
|
|
+.mb-18 {
|
|
|
+ margin-bottom: 18px;
|
|
|
+}
|
|
|
+.mb-19 {
|
|
|
+ margin-bottom: 19px;
|
|
|
+}
|
|
|
+.mb-20 {
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+.mb-21 {
|
|
|
+ margin-bottom: 21px;
|
|
|
+}
|
|
|
+.mb-23 {
|
|
|
+ margin-bottom: 23px;
|
|
|
+}
|
|
|
+.mb-24 {
|
|
|
+ margin-bottom: 24px;
|
|
|
+}
|
|
|
+.mb-25 {
|
|
|
+ margin-bottom: 25px;
|
|
|
+}
|
|
|
+.mb-26 {
|
|
|
+ margin-bottom: 26px;
|
|
|
+}
|
|
|
+.mb-28 {
|
|
|
+ margin-bottom: 28px;
|
|
|
+}
|
|
|
+.mb-30 {
|
|
|
+ margin-bottom: 30px;
|
|
|
+}
|
|
|
+.mb-31 {
|
|
|
+ margin-bottom: 32px;
|
|
|
+}
|
|
|
+.mb-32 {
|
|
|
+ margin-bottom: 32px;
|
|
|
+}
|
|
|
+.mb-36 {
|
|
|
+ margin-bottom: 36px;
|
|
|
+}
|
|
|
+.mb-39 {
|
|
|
+ margin-bottom: 39px;
|
|
|
+}
|
|
|
+.mb-48 {
|
|
|
+ margin-bottom: 48px;
|
|
|
+}
|
|
|
+.mb-50 {
|
|
|
+ margin-bottom: 50px;
|
|
|
+}
|
|
|
+.mb-66 {
|
|
|
+ margin-bottom: 66px;
|
|
|
+}
|
|
|
+.mb-99 {
|
|
|
+ margin-bottom: 99px;
|
|
|
+}
|
|
|
|
|
|
-@font-face {
|
|
|
- font-family: 'DIN-Bold';
|
|
|
- src: url('/fonts/din-bold.otf');
|
|
|
+.ml-2 {
|
|
|
+ margin-left: 2px;
|
|
|
}
|
|
|
-@font-face {
|
|
|
- font-family: 'DIN-Regular';
|
|
|
- src: url('/fonts/din-regular.otf');
|
|
|
+.ml-3 {
|
|
|
+ margin-left: 3px;
|
|
|
}
|
|
|
-@font-face {
|
|
|
- font-family: 'DIN-Black';
|
|
|
- src: url('/fonts/DIN-Black.otf');
|
|
|
+.ml-4 {
|
|
|
+ margin-left: 4px;
|
|
|
}
|
|
|
-/* 字体名称 */
|
|
|
-.ff-DIN-Bold { font-family: 'DIN-Bold'; }
|
|
|
-.ff-DIN-Black { font-family: 'DIN-Black';}
|
|
|
-.ff-DIN-Regular { font-family: 'DIN-Regular'; }
|
|
|
-
|
|
|
-/* H5 */
|
|
|
-.tab-page { padding-bottom: calc(var(--van-tabbar-height) + env(safe-area-inset-bottom) ); }
|
|
|
-.page { padding-bottom: env(safe-area-inset-bottom); }
|
|
|
-.page, .tab-page {
|
|
|
- width: 100%;
|
|
|
- min-height: 100vh;
|
|
|
- background-color: #F9F9F9;
|
|
|
- font-family: PingFangSC-Regular, PingFang SC;
|
|
|
- -webkit-overflow-scrolling: touch;
|
|
|
-
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: flex-start;
|
|
|
-
|
|
|
+.ml-5 {
|
|
|
+ margin-left: 5px;
|
|
|
}
|
|
|
-
|
|
|
-/* 公共样式 */
|
|
|
-* { touch-action: pan-y; margin: 0; padding: 0; box-sizing: border-box; }
|
|
|
-a { text-decoration: none !important; }
|
|
|
-img { max-width: 100% !important; width: 100%; vertical-align: middle; }
|
|
|
-input { outline: none; border: none; }
|
|
|
-.coming-soon {
|
|
|
- font-size: 32px;
|
|
|
- text-align: center;
|
|
|
- padding-top: 100px;
|
|
|
- color: #778899;
|
|
|
- letter-spacing: 2px;
|
|
|
+.ml-6 {
|
|
|
+ margin-left: 6px;
|
|
|
+}
|
|
|
+.ml-7 {
|
|
|
+ margin-left: 7px;
|
|
|
+}
|
|
|
+.ml-8 {
|
|
|
+ margin-left: 8px;
|
|
|
+}
|
|
|
+.ml-10 {
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+.ml-12 {
|
|
|
+ margin-left: 12px;
|
|
|
+}
|
|
|
+.ml-13 {
|
|
|
+ margin-left: 13px;
|
|
|
+}
|
|
|
+.ml-15 {
|
|
|
+ margin-left: 15px;
|
|
|
+}
|
|
|
+.ml-16 {
|
|
|
+ margin-left: 16px;
|
|
|
+}
|
|
|
+.ml-17 {
|
|
|
+ margin-left: 17px;
|
|
|
+}
|
|
|
+.ml-20 {
|
|
|
+ margin-left: 20px;
|
|
|
+}
|
|
|
+.ml-22 {
|
|
|
+ margin-left: 22px;
|
|
|
+}
|
|
|
+.ml-23 {
|
|
|
+ margin-left: 23px;
|
|
|
+}
|
|
|
+.ml-24 {
|
|
|
+ margin-left: 24px;
|
|
|
+}
|
|
|
+.ml-35 {
|
|
|
+ margin-left: 35px;
|
|
|
}
|
|
|
-/** 背景尺寸 */
|
|
|
-.bg-all { background-size: 100% 100% !important;}
|
|
|
-.bg-cover { background-size: cover !important;}
|
|
|
-.bg-contain { background-size: contain !important; }
|
|
|
-
|
|
|
-/** 字体颜色 */
|
|
|
-
|
|
|
-.color-222222 { color: #222222; }
|
|
|
-.color-333333 { color: #333333; }
|
|
|
-.color-444444 { color: #444444; }
|
|
|
-.color-555555 { color: #555555; }
|
|
|
-.color-666666 { color: #666666; }
|
|
|
-.color-777777 { color: #777777; }
|
|
|
-.color-888888 { color: #888888; }
|
|
|
-.color-999999 { color: #999999; }
|
|
|
-.color-FFFFFF { color: #FFFFFF; }
|
|
|
-
|
|
|
-
|
|
|
-/** 背景颜色 */
|
|
|
-.bg-F9F9F9 { background-color: #F9F9F9; }
|
|
|
-.bg-EEEEEE { background-color: #EEEEEE; }
|
|
|
-.bg-DEDEDE { background-color: #DEDEDE; }
|
|
|
-.bg-FFFFFF { background-color: #FFFFFF; }
|
|
|
-
|
|
|
-/** 尺寸相关 */
|
|
|
-.w-min-0 { min-width: 0; }
|
|
|
-.w-0 { width: 0; }
|
|
|
-.w-100 { width: 100%; }
|
|
|
-.w-50 { width: 50%; }
|
|
|
-.w-auto { width: auto; }
|
|
|
-
|
|
|
-
|
|
|
-.h-100 { height: 100%; }
|
|
|
-.h-auto { height: auto; }
|
|
|
-.h-min-100 { min-height: 100%; }
|
|
|
-
|
|
|
-.vw-100 { width: 100vw; }
|
|
|
-.vh-100 { height: 100vh; }
|
|
|
-
|
|
|
-
|
|
|
-/** 显示类型 **/
|
|
|
-.d-block { display: block; }
|
|
|
-.d-inline { display: inline; }
|
|
|
-.d-inline-block { display: inline-block; }
|
|
|
-.d-flex { display: flex; }
|
|
|
-
|
|
|
-
|
|
|
-.flex-1 { flex: 1; }
|
|
|
-.flex-wrap { flex-wrap: wrap; }
|
|
|
-.flex-h-between { display: flex; justify-content: space-between; align-items: center;}
|
|
|
-.flex-h-center { display: flex; justify-content: center; align-items: center; }
|
|
|
-.flex-h-around { display: flex; justify-content: space-around; align-items: center;}
|
|
|
-.flex-h-start { display: flex; justify-content: flex-start; align-items: center;}
|
|
|
-.flex-h-end { display: flex; justify-content: flex-end; align-items: center;}
|
|
|
-.flex-v-center { display: flex; flex-direction: column; justify-content: center; align-items: center;}
|
|
|
-.flex-v { flex-direction: column; }
|
|
|
-.flex-h { flex-direction: row; }
|
|
|
-.flex-shrink { flex-shrink: 0; }
|
|
|
-
|
|
|
-.justify-content-start { justify-content: flex-start; }
|
|
|
-.justify-content-end { justify-content: flex-end; }
|
|
|
-.justify-content-center { justify-content: center; }
|
|
|
-.justify-content-between { justify-content: space-between; }
|
|
|
-.justify-content-around { justify-content: space-around; }
|
|
|
-
|
|
|
-.align-items-start { align-items: flex-start; }
|
|
|
-.align-items-end { align-items: flex-end; }
|
|
|
-.align-items-center { align-items: center; }
|
|
|
-.align-items-baseline { align-items: baseline; }
|
|
|
-/* 盒子模型 - 间距 */
|
|
|
-
|
|
|
-.p-1 { padding-top: 1px; padding-right: 1px; padding-bottom: 1px; padding-left: 1px;}
|
|
|
-.p-2 { padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px;}
|
|
|
-.p-3 { padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px;}
|
|
|
-.p-4 { padding-top: 4px; padding-right: 4px; padding-bottom: 4px; padding-left: 4px;}
|
|
|
-.p-6 { padding-top: 6px; padding-right: 6px; padding-bottom: 6px; padding-left: 6px;}
|
|
|
-.p-8 { padding-top: 8px; padding-right: 8px; padding-bottom: 8px; padding-left: 8px;}
|
|
|
-.p-10 { padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px;}
|
|
|
-.p-12 { padding-top: 12px; padding-right: 12px; padding-bottom: 12px; padding-left: 12px;}
|
|
|
-.p-15 { padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px;}
|
|
|
-.p-16 { padding-top: 16px; padding-right: 16px; padding-bottom: 16px; padding-left: 16px;}
|
|
|
-
|
|
|
-.px-2 { padding-left: 2px; padding-right: 2px; }
|
|
|
-.px-3 { padding-left: 3px; padding-right: 3px; }
|
|
|
-.px-4 { padding-left: 4px; padding-right: 4px; }
|
|
|
-.px-5 { padding-left: 5px; padding-right: 5px; }
|
|
|
-.px-6 { padding-left: 6px; padding-right: 6px; }
|
|
|
-.px-7 { padding-left: 7px; padding-right: 7px; }
|
|
|
-.px-8 { padding-left: 8px; padding-right: 8px; }
|
|
|
-.px-9 { padding-left: 9px; padding-right: 9px; }
|
|
|
-.px-10 { padding-left: 10px; padding-right: 10px; }
|
|
|
-.px-11 { padding-left: 11px; padding-right: 11px; }
|
|
|
-.px-12 { padding-left: 12px; padding-right: 12px; }
|
|
|
-.px-13 { padding-left: 13px; padding-right: 13px; }
|
|
|
-.px-15 { padding-left: 15px; padding-right: 15px; }
|
|
|
-.px-16 { padding-left: 16px; padding-right: 16px; }
|
|
|
-.px-17 { padding-left: 17px; padding-right: 17px; }
|
|
|
-.px-18 { padding-left: 18px; padding-right: 18px; }
|
|
|
-.px-20 { padding-left: 20px; padding-right: 20px; }
|
|
|
-.px-22 { padding-left: 22px; padding-right: 22px; }
|
|
|
-.px-24 { padding-left: 24px; padding-right: 24px; }
|
|
|
-.px-25 { padding-left: 25px; padding-right: 25px; }
|
|
|
-.px-27 { padding-left: 27px; padding-right: 27px; }
|
|
|
-.px-28 { padding-left: 28px; padding-right: 28px; }
|
|
|
-.px-30 { padding-left: 30px; padding-right: 30px; }
|
|
|
-.px-33 { padding-left: 33px; padding-right: 33px; }
|
|
|
-.px-38 { padding-left: 38px; padding-right: 38px; }
|
|
|
-.px-40 { padding-left: 40px; padding-right: 40px; }
|
|
|
-
|
|
|
-.py-1 { padding-top: 1px; padding-bottom: 1px;}
|
|
|
-.py-2 { padding-top: 2px; padding-bottom: 2px;}
|
|
|
-.py-3 { padding-top: 3px; padding-bottom: 3px;}
|
|
|
-.py-4 { padding-top: 4px; padding-bottom: 4px;}
|
|
|
-.py-6 { padding-top: 6px; padding-bottom: 6px;}
|
|
|
-.py-8 { padding-top: 8px; padding-bottom: 8px;}
|
|
|
-.py-9 { padding-top: 9px; padding-bottom: 9px;}
|
|
|
-.py-10 { padding-top: 10px; padding-bottom: 10px;}
|
|
|
-.py-11 { padding-top: 11px; padding-bottom: 11px;}
|
|
|
-.py-12 { padding-top: 12px; padding-bottom: 12px;}
|
|
|
-.py-13 { padding-top: 13px; padding-bottom: 13px;}
|
|
|
-.py-14 { padding-top: 14px; padding-bottom: 14px;}
|
|
|
-.py-15 { padding-top: 15px; padding-bottom: 15px;}
|
|
|
-.py-16 { padding-top: 16px; padding-bottom: 16px;}
|
|
|
-.py-18 { padding-top: 18px; padding-bottom: 18px;}
|
|
|
-.py-20 { padding-top: 20px; padding-bottom: 20px;}
|
|
|
-.py-21 { padding-top: 21px; padding-bottom: 21px;}
|
|
|
-.py-22 { padding-top: 22px; padding-bottom: 22px;}
|
|
|
-.py-34 { padding-top: 34px; padding-bottom: 34px;}
|
|
|
-
|
|
|
-.pt-2 { padding-top: 2px; }
|
|
|
-.pt-3 { padding-top: 3px; }
|
|
|
-.pt-4 { padding-top: 4px; }
|
|
|
-.pt-5 { padding-top: 5px; }
|
|
|
-.pt-6 { padding-top: 6px; }
|
|
|
-.pt-7 { padding-top: 7px; }
|
|
|
-.pt-8 { padding-top: 8px; }
|
|
|
-.pt-9 { padding-top: 9px; }
|
|
|
-.pt-10 { padding-top: 10px; }
|
|
|
-.pt-11 { padding-top: 11px; }
|
|
|
-.pt-12 { padding-top: 12px; }
|
|
|
-.pt-13 { padding-top: 13px; }
|
|
|
-.pt-14 { padding-top: 14px; }
|
|
|
-.pt-15 { padding-top: 15px; }
|
|
|
-.pt-16 { padding-top: 16px; }
|
|
|
-.pt-17 { padding-top: 17px; }
|
|
|
-.pt-18 { padding-top: 18px; }
|
|
|
-.pt-19 { padding-top: 19px; }
|
|
|
-.pt-20 { padding-top: 20px; }
|
|
|
-.pt-21 { padding-top: 21px; }
|
|
|
-.pt-22 { padding-top: 22px; }
|
|
|
-.pt-23 { padding-top: 23px; }
|
|
|
-.pt-24 { padding-top: 24px; }
|
|
|
-.pt-26 { padding-top: 26px; }
|
|
|
-.pt-27 { padding-top: 27px; }
|
|
|
-.pt-29 { padding-top: 29px; }
|
|
|
-.pt-30 { padding-top: 30px; }
|
|
|
-.pt-33 { padding-top: 33px; }
|
|
|
-.pt-36 { padding-top: 36px; }
|
|
|
-.pt-40 { padding-top: 40px; }
|
|
|
-.pt-59 { padding-top: 59px; }
|
|
|
-.pt-76 { padding-top: 76px; }
|
|
|
-.pt-99 { padding-top: 99px; }
|
|
|
-
|
|
|
-.pt-100 { padding-top: 100px; }
|
|
|
-
|
|
|
-.pr-1 { padding-right: 1px; }
|
|
|
-.pr-2 { padding-right: 2px; }
|
|
|
-.pr-3 { padding-right: 3px; }
|
|
|
-.pr-5 { padding-right: 5px; }
|
|
|
-.pr-4 { padding-right: 4px; }
|
|
|
-.pr-6 { padding-right: 6px; }
|
|
|
-.pr-8 { padding-right: 8px; }
|
|
|
-.pr-10 { padding-right: 10px; }
|
|
|
-.pr-14 { padding-right: 14px; }
|
|
|
-.pr-16 { padding-right: 16px; }
|
|
|
-.pr-17 { padding-right: 17px; }
|
|
|
-.pr-21 { padding-right: 21px; }
|
|
|
-.pr-22 { padding-right: 22px; }
|
|
|
-.pr-24 { padding-right: 24px; }
|
|
|
-
|
|
|
-.pb-2 { padding-bottom: 2px; }
|
|
|
-.pb-3 { padding-bottom: 3px; }
|
|
|
-.pb-4 { padding-bottom: 4px; }
|
|
|
-.pb-6 { padding-bottom: 6px; }
|
|
|
-.pb-8 { padding-bottom: 8px; }
|
|
|
-.pb-9 { padding-bottom: 9px; }
|
|
|
-.pb-10 { padding-bottom: 10px; }
|
|
|
-.pb-11 { padding-bottom: 11px; }
|
|
|
-.pb-12 { padding-bottom: 12px; }
|
|
|
-.pb-13 { padding-bottom: 13px; }
|
|
|
-.pb-14 { padding-bottom: 14px; }
|
|
|
-.pb-15 { padding-bottom: 15px; }
|
|
|
-.pb-16 { padding-bottom: 16px; }
|
|
|
-.pb-18 { padding-bottom: 18px; }
|
|
|
-.pb-19 { padding-bottom: 19px; }
|
|
|
-.pb-20 { padding-bottom: 20px; }
|
|
|
-.pb-21 { padding-bottom: 21px; }
|
|
|
-.pb-22 { padding-bottom: 22px; }
|
|
|
-.pb-29 { padding-bottom: 29px; }
|
|
|
-.pb-32 { padding-bottom: 32px; }
|
|
|
-.pb-35 { padding-bottom: 35px; }
|
|
|
-.pb-99 { padding-bottom: 99px; }
|
|
|
-
|
|
|
-.pl-0 { padding-left: 0px; }
|
|
|
-.pl-2 { padding-left: 2px; }
|
|
|
-.pl-4 { padding-left: 4px; }
|
|
|
-.pl-6 { padding-left: 6px; }
|
|
|
-.pl-7 { padding-left: 6px; }
|
|
|
-.pl-8 { padding-left: 8px; }
|
|
|
-.pl-10 { padding-left: 10px; }
|
|
|
-.pl-14 { padding-left: 14px; }
|
|
|
-.pl-12 { padding-left: 12px; }
|
|
|
-.pl-16 { padding-left: 16px; }
|
|
|
-.pl-17 { padding-left: 17px; }
|
|
|
-.pl-18 { padding-left: 18px; }
|
|
|
-.pl-19 { padding-left: 19px; }
|
|
|
-.pl-20 { padding-left: 20px; }
|
|
|
-.pl-22 { padding-left: 22px; }
|
|
|
-.pl-24 { padding-left: 24px; }
|
|
|
-.pl-25 { padding-left: 25px; }
|
|
|
-.pl-26 { padding-left: 26px; }
|
|
|
-.pl-27 { padding-left: 27px; }
|
|
|
-.pl-29 { padding-left: 29px; }
|
|
|
-.pl-38 { padding-left: 38px; }
|
|
|
-
|
|
|
-
|
|
|
-.mx-auto { margin-left: auto; margin-right: auto; }
|
|
|
-.mx-2 { margin-left: 2px; margin-right: 2px; }
|
|
|
-.mx-4 { margin-left: 4px; margin-right: 4px; }
|
|
|
-.mx-6 { margin-left: 6px; margin-right: 6px; }
|
|
|
-.mx-8 { margin-left: 8px; margin-right: 8px; }
|
|
|
-.mx-10 { margin-left: 10px; margin-right: 10px; }
|
|
|
-.mx-17 { margin-left: 17px; margin-right: 17px; }
|
|
|
-.mx-20 { margin-left: 20px; margin-right: 20px; }
|
|
|
-.mx-28 { margin-left: 28px; margin-right: 28px; }
|
|
|
-
|
|
|
-.my-2 { margin-top: 2px; margin-bottom: 2px; }
|
|
|
-.my-3 { margin-top: 3px; margin-bottom: 3px; }
|
|
|
-.my-4 { margin-top: 4px; margin-bottom: 4px; }
|
|
|
-.my-6 { margin-top: 6px; margin-bottom: 6px; }
|
|
|
-.my-8 { margin-top: 8px; margin-bottom: 8px; }
|
|
|
-.my-10 { margin-top: 10px; margin-bottom: 10px; }
|
|
|
-.my-12 { margin-top: 12px; margin-bottom: 12px; }
|
|
|
-.my-14 { margin-top: 14px; margin-bottom: 14px; }
|
|
|
-.my-15 { margin-top: 15px; margin-bottom: 15px; }
|
|
|
-.my-16 { margin-top: 16px; margin-bottom: 16px; }
|
|
|
-.my-24 { margin-top: 24px; margin-bottom: 24px; }
|
|
|
-
|
|
|
-.mt-1 { margin-top: 1px; }
|
|
|
-.mt-2 { margin-top: 2px; }
|
|
|
-.mt-3 { margin-top: 3px; }
|
|
|
-.mt-4 { margin-top: 4px; }
|
|
|
-.mt-5 { margin-top: 5px; }
|
|
|
-.mt-6 { margin-top: 6px; }
|
|
|
-.mt-7 { margin-top: 7px; }
|
|
|
-.mt-8 { margin-top: 8px; }
|
|
|
-.mt-9 { margin-top: 9px; }
|
|
|
-.mt-10 { margin-top: 10px; }
|
|
|
-.mt-11 { margin-top: 11px; }
|
|
|
-.mt-12 { margin-top: 12px; }
|
|
|
-.mt-13 { margin-top: 13px; }
|
|
|
-.mt-14 { margin-top: 14px; }
|
|
|
-.mt-15 { margin-top: 15px; }
|
|
|
-.mt-16 { margin-top: 16px; }
|
|
|
-.mt-17 { margin-top: 17px; }
|
|
|
-.mt-18 { margin-top: 18px; }
|
|
|
-.mt-19 { margin-top: 19px; }
|
|
|
-.mt-20 { margin-top: 20px; }
|
|
|
-.mt-21 { margin-top: 21px; }
|
|
|
-.mt-22 { margin-top: 22px; }
|
|
|
-.mt-23 { margin-top: 23px; }
|
|
|
-.mt-24 { margin-top: 24px; }
|
|
|
-.mt-25 { margin-top: 25px; }
|
|
|
-.mt-26 { margin-top: 26px; }
|
|
|
-.mt-28 { margin-top: 28px; }
|
|
|
-.mt-29 { margin-top: 29px; }
|
|
|
-.mt-30 { margin-top: 30px; }
|
|
|
-.mt-31 { margin-top: 31px; }
|
|
|
-.mt-32 { margin-top: 32px; }
|
|
|
-.mt-34 { margin-top: 34px; }
|
|
|
-.mt-38 { margin-top: 38px; }
|
|
|
-.mt-39 { margin-top: 39px; }
|
|
|
-.mt-40 { margin-top: 40px; }
|
|
|
-.mt-41 { margin-top: 41px; }
|
|
|
-.mt-47 { margin-top: 47px; }
|
|
|
-.mt-50 { margin-top: 50px; }
|
|
|
-.mt-60 { margin-top: 60px; }
|
|
|
-.mt-99 { margin-top: 99px; }
|
|
|
-.mt-105 { margin-top: 105px; }
|
|
|
-
|
|
|
-
|
|
|
-.mr-2 { margin-right: 2px; }
|
|
|
-.mr-3 { margin-right: 3px; }
|
|
|
-.mr-4 { margin-right: 4px; }
|
|
|
-.mr-5 { margin-right: 5px; }
|
|
|
-.mr-6 { margin-right: 6px; }
|
|
|
-.mr-7 { margin-right: 7px; }
|
|
|
-.mr-8 { margin-right: 8px; }
|
|
|
-.mr-9 { margin-right: 9px; }
|
|
|
-.mr-10 { margin-right: 10px; }
|
|
|
-.mr-11 { margin-right: 11px; }
|
|
|
-.mr-12 { margin-right: 12px; }
|
|
|
-.mr-13 { margin-right: 13px; }
|
|
|
-.mr-14 { margin-right: 14px; }
|
|
|
-.mr-15 { margin-right: 15px; }
|
|
|
-.mr-16 { margin-right: 16px; }
|
|
|
-.mr-18 { margin-right: 18px; }
|
|
|
-.mr-20 { margin-right: 20px; }
|
|
|
-.mr-21 { margin-right: 21px; }
|
|
|
-.mr-25 { margin-right: 25px; }
|
|
|
-.mr-30 { margin-right: 30px; }
|
|
|
-.mr-35 { margin-right: 35px; }
|
|
|
-.mr-40 { margin-right: 40px; }
|
|
|
-.mr-79 { margin-right: 79px; }
|
|
|
-
|
|
|
-.mb-0 { margin-bottom: 0px; }
|
|
|
-.mb-1 { margin-bottom: 1px; }
|
|
|
-.mb-2 { margin-bottom: 2px; }
|
|
|
-.mb-3 { margin-bottom: 3px; }
|
|
|
-.mb-4 { margin-bottom: 4px; }
|
|
|
-.mb-5 { margin-bottom: 5px; }
|
|
|
-.mb-6 { margin-bottom: 6px; }
|
|
|
-.mb-7 { margin-bottom: 7px; }
|
|
|
-.mb-8 { margin-bottom: 8px; }
|
|
|
-.mb-9 { margin-bottom: 9px; }
|
|
|
-.mb-10 { margin-bottom: 10px; }
|
|
|
-.mb-11 { margin-bottom: 11px; }
|
|
|
-.mb-12 { margin-bottom: 12px; }
|
|
|
-.mb-13 { margin-bottom: 13px; }
|
|
|
-.mb-14 { margin-bottom: 14px; }
|
|
|
-.mb-15 { margin-bottom: 15px; }
|
|
|
-.mb-16 { margin-bottom: 16px; }
|
|
|
-.mb-17 { margin-bottom: 17px; }
|
|
|
-.mb-18 { margin-bottom: 18px; }
|
|
|
-.mb-19 { margin-bottom: 19px; }
|
|
|
-.mb-20 { margin-bottom: 20px; }
|
|
|
-.mb-21 { margin-bottom: 21px; }
|
|
|
-.mb-23 { margin-bottom: 23px; }
|
|
|
-.mb-24 { margin-bottom: 24px; }
|
|
|
-.mb-25 { margin-bottom: 25px; }
|
|
|
-.mb-26 { margin-bottom: 26px; }
|
|
|
-.mb-28 { margin-bottom: 28px; }
|
|
|
-.mb-30 { margin-bottom: 30px; }
|
|
|
-.mb-31 { margin-bottom: 32px; }
|
|
|
-.mb-32 { margin-bottom: 32px; }
|
|
|
-.mb-36 { margin-bottom: 36px; }
|
|
|
-.mb-39 { margin-bottom: 39px; }
|
|
|
-.mb-48 { margin-bottom: 48px; }
|
|
|
-.mb-50 { margin-bottom: 50px; }
|
|
|
-.mb-66 { margin-bottom: 66px; }
|
|
|
-.mb-99 { margin-bottom: 99px; }
|
|
|
-
|
|
|
-
|
|
|
-.ml-2 { margin-left: 2px; }
|
|
|
-.ml-3 { margin-left: 3px; }
|
|
|
-.ml-4 { margin-left: 4px; }
|
|
|
-.ml-5 { margin-left: 5px; }
|
|
|
-.ml-6 { margin-left: 6px; }
|
|
|
-.ml-7 { margin-left: 7px; }
|
|
|
-.ml-8 { margin-left: 8px; }
|
|
|
-.ml-10 { margin-left: 10px; }
|
|
|
-.ml-12 { margin-left: 12px; }
|
|
|
-.ml-13 { margin-left: 13px; }
|
|
|
-.ml-15 { margin-left: 15px; }
|
|
|
-.ml-16 { margin-left: 16px; }
|
|
|
-.ml-17 { margin-left: 17px; }
|
|
|
-.ml-20 { margin-left: 20px; }
|
|
|
-.ml-22 { margin-left: 22px; }
|
|
|
-.ml-23 { margin-left: 23px; }
|
|
|
-.ml-24 { margin-left: 24px; }
|
|
|
-.ml-35 { margin-left: 35px; }
|
|
|
-
|
|
|
|
|
|
/* 字体 - 粗细 */
|
|
|
-.f-100 { font-weight: 100; }
|
|
|
-.f-200 { font-weight: 200; }
|
|
|
-.f-300 { font-weight: 300; }
|
|
|
-.f-400 { font-weight: 400; }
|
|
|
-.f-500 { font-weight: 500; }
|
|
|
-.f-600 { font-weight: 600; }
|
|
|
-.f-700 { font-weight: 700; }
|
|
|
-.f-800 { font-weight: 800; }
|
|
|
-.f-900 { font-weight: 900; }
|
|
|
-
|
|
|
-
|
|
|
-.f0 { font-size: 0; }
|
|
|
-.f8 { font-size: 8px; }
|
|
|
-.f9 { font-size: 9px; }
|
|
|
-.f10 { font-size: 10px; }
|
|
|
-.f11 { font-size: 11px; }
|
|
|
-.f12 { font-size: 12px; }
|
|
|
-.f13 { font-size: 13px; }
|
|
|
-.f14 { font-size: 14px; }
|
|
|
-.f15 { font-size: 15px; }
|
|
|
-.f16 { font-size: 16px; }
|
|
|
-.f17 { font-size: 17px; }
|
|
|
-.f18 { font-size: 18px; }
|
|
|
-.f19 { font-size: 19px; }
|
|
|
-.f20 { font-size: 20px; }
|
|
|
-.f21 { font-size: 21px; }
|
|
|
-.f22 { font-size: 22px; }
|
|
|
-.f23 { font-size: 23px; }
|
|
|
-.f24 { font-size: 24px; }
|
|
|
-.f25 { font-size: 25px; }
|
|
|
-.f26 { font-size: 26px; }
|
|
|
-.f27 { font-size: 27px; }
|
|
|
-.f28 { font-size: 28px; }
|
|
|
-.f29 { font-size: 29px;}
|
|
|
-.f30 { font-size: 30px; }
|
|
|
-.f32 { font-size: 32px; }
|
|
|
-.f34 { font-size: 34px; }
|
|
|
-.f35 { font-size: 35px; }
|
|
|
-.f36 { font-size: 36px; }
|
|
|
-.f38 { font-size: 38px; }
|
|
|
-.f40 { font-size: 40px; }
|
|
|
-.f43 { font-size: 43px; }
|
|
|
-.f48 { font-size: 48px; }
|
|
|
-.f50 { font-size: 50px; }
|
|
|
+.f-100 {
|
|
|
+ font-weight: 100;
|
|
|
+}
|
|
|
+.f-200 {
|
|
|
+ font-weight: 200;
|
|
|
+}
|
|
|
+.f-300 {
|
|
|
+ font-weight: 300;
|
|
|
+}
|
|
|
+.f-400 {
|
|
|
+ font-weight: 400;
|
|
|
+}
|
|
|
+.f-500 {
|
|
|
+ font-weight: 500;
|
|
|
+}
|
|
|
+.f-600 {
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+.f-700 {
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+.f-800 {
|
|
|
+ font-weight: 800;
|
|
|
+}
|
|
|
+.f-900 {
|
|
|
+ font-weight: 900;
|
|
|
+}
|
|
|
+
|
|
|
+.f0 {
|
|
|
+ font-size: 0;
|
|
|
+}
|
|
|
+.f8 {
|
|
|
+ font-size: 8px;
|
|
|
+}
|
|
|
+.f9 {
|
|
|
+ font-size: 9px;
|
|
|
+}
|
|
|
+.f10 {
|
|
|
+ font-size: 10px;
|
|
|
+}
|
|
|
+.f11 {
|
|
|
+ font-size: 11px;
|
|
|
+}
|
|
|
+.f12 {
|
|
|
+ font-size: 12px;
|
|
|
+}
|
|
|
+.f13 {
|
|
|
+ font-size: 13px;
|
|
|
+}
|
|
|
+.f14 {
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+.f15 {
|
|
|
+ font-size: 15px;
|
|
|
+}
|
|
|
+.f16 {
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+.f17 {
|
|
|
+ font-size: 17px;
|
|
|
+}
|
|
|
+.f18 {
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
+.f19 {
|
|
|
+ font-size: 19px;
|
|
|
+}
|
|
|
+.f20 {
|
|
|
+ font-size: 20px;
|
|
|
+}
|
|
|
+.f21 {
|
|
|
+ font-size: 21px;
|
|
|
+}
|
|
|
+.f22 {
|
|
|
+ font-size: 22px;
|
|
|
+}
|
|
|
+.f23 {
|
|
|
+ font-size: 23px;
|
|
|
+}
|
|
|
+.f24 {
|
|
|
+ font-size: 24px;
|
|
|
+}
|
|
|
+.f25 {
|
|
|
+ font-size: 25px;
|
|
|
+}
|
|
|
+.f26 {
|
|
|
+ font-size: 26px;
|
|
|
+}
|
|
|
+.f27 {
|
|
|
+ font-size: 27px;
|
|
|
+}
|
|
|
+.f28 {
|
|
|
+ font-size: 28px;
|
|
|
+}
|
|
|
+.f29 {
|
|
|
+ font-size: 29px;
|
|
|
+}
|
|
|
+.f30 {
|
|
|
+ font-size: 30px;
|
|
|
+}
|
|
|
+.f32 {
|
|
|
+ font-size: 32px;
|
|
|
+}
|
|
|
+.f34 {
|
|
|
+ font-size: 34px;
|
|
|
+}
|
|
|
+.f35 {
|
|
|
+ font-size: 35px;
|
|
|
+}
|
|
|
+.f36 {
|
|
|
+ font-size: 36px;
|
|
|
+}
|
|
|
+.f38 {
|
|
|
+ font-size: 38px;
|
|
|
+}
|
|
|
+.f40 {
|
|
|
+ font-size: 40px;
|
|
|
+}
|
|
|
+.f43 {
|
|
|
+ font-size: 43px;
|
|
|
+}
|
|
|
+.f48 {
|
|
|
+ font-size: 48px;
|
|
|
+}
|
|
|
+.f50 {
|
|
|
+ font-size: 50px;
|
|
|
+}
|
|
|
|
|
|
/* 字符间距 */
|
|
|
-.ls-1 { letter-spacing: 1px;}
|
|
|
-.ls-2 { letter-spacing: 2px;}
|
|
|
+.ls-1 {
|
|
|
+ letter-spacing: 1px;
|
|
|
+}
|
|
|
+.ls-2 {
|
|
|
+ letter-spacing: 2px;
|
|
|
+}
|
|
|
|
|
|
/* 圆角 */
|
|
|
-.rounded-2 { border-radius: 2px; }
|
|
|
-.rounded-3 { border-radius: 3px; }
|
|
|
-.rounded-4 { border-radius: 4px; }
|
|
|
-.rounded-6 { border-radius: 6px; }
|
|
|
-.rounded-7 { border-radius: 7px; }
|
|
|
-.rounded-8 { border-radius: 8px; }
|
|
|
-.rounded-9 { border-radius: 9px; }
|
|
|
-.rounded-10 { border-radius: 10px;}
|
|
|
-.rounded-12 { border-radius: 12px;}
|
|
|
-.rounded-13 { border-radius: 13px;}
|
|
|
-.rounded-14 { border-radius: 14px;}
|
|
|
-.rounded-15 { border-radius: 15px;}
|
|
|
-.rounded-18 { border-radius: 18px;}
|
|
|
-.rounded-19 { border-radius: 19px;}
|
|
|
-.rounded-20 { border-radius: 20px;}
|
|
|
-.rounded-22 { border-radius: 22px;}
|
|
|
-.rounded-25 { border-radius: 25px;}
|
|
|
-.rounded-49 { border-radius: 49px;}
|
|
|
-.rounded-76 { border-radius: 76px;}
|
|
|
-.rounded-circle { border-radius: 50%; }
|
|
|
-
|
|
|
+.rounded-2 {
|
|
|
+ border-radius: 2px;
|
|
|
+}
|
|
|
+.rounded-3 {
|
|
|
+ border-radius: 3px;
|
|
|
+}
|
|
|
+.rounded-4 {
|
|
|
+ border-radius: 4px;
|
|
|
+}
|
|
|
+.rounded-6 {
|
|
|
+ border-radius: 6px;
|
|
|
+}
|
|
|
+.rounded-7 {
|
|
|
+ border-radius: 7px;
|
|
|
+}
|
|
|
+.rounded-8 {
|
|
|
+ border-radius: 8px;
|
|
|
+}
|
|
|
+.rounded-9 {
|
|
|
+ border-radius: 9px;
|
|
|
+}
|
|
|
+.rounded-10 {
|
|
|
+ border-radius: 10px;
|
|
|
+}
|
|
|
+.rounded-12 {
|
|
|
+ border-radius: 12px;
|
|
|
+}
|
|
|
+.rounded-13 {
|
|
|
+ border-radius: 13px;
|
|
|
+}
|
|
|
+.rounded-14 {
|
|
|
+ border-radius: 14px;
|
|
|
+}
|
|
|
+.rounded-15 {
|
|
|
+ border-radius: 15px;
|
|
|
+}
|
|
|
+.rounded-18 {
|
|
|
+ border-radius: 18px;
|
|
|
+}
|
|
|
+.rounded-19 {
|
|
|
+ border-radius: 19px;
|
|
|
+}
|
|
|
+.rounded-20 {
|
|
|
+ border-radius: 20px;
|
|
|
+}
|
|
|
+.rounded-22 {
|
|
|
+ border-radius: 22px;
|
|
|
+}
|
|
|
+.rounded-25 {
|
|
|
+ border-radius: 25px;
|
|
|
+}
|
|
|
+.rounded-49 {
|
|
|
+ border-radius: 49px;
|
|
|
+}
|
|
|
+.rounded-76 {
|
|
|
+ border-radius: 76px;
|
|
|
+}
|
|
|
+.rounded-circle {
|
|
|
+ border-radius: 50%;
|
|
|
+}
|
|
|
|
|
|
/* 定位 */
|
|
|
-.position-relative { position: relative; }
|
|
|
-.position-absolute { position: absolute; }
|
|
|
-.position-fixed { position: fixed; }
|
|
|
-
|
|
|
-.fixed-top { position: fixed; top: 0; left: 50%; transform: translateX(-50%); }
|
|
|
-.fixed-bottom { position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); }
|
|
|
-
|
|
|
-
|
|
|
-.absolute-top { position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
|
|
|
-.absolute-bottom { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
|
|
|
-.absolute-right { position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
|
|
|
-.absolute-left { position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
|
|
|
-
|
|
|
-.absolute-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
|
|
|
-.absolute-tr { position: absolute; top: -1px; right: -1px; }
|
|
|
-.absolute-tl { position: absolute; top: 0; left: 0; }
|
|
|
-
|
|
|
-.t-0 { top: 0; }
|
|
|
-.t-2 { top: 2px; }
|
|
|
-.t-3 { top: 3px; }
|
|
|
-.t-11 { top: 11px;}
|
|
|
-.t-14 { top: 14px; }
|
|
|
+.position-relative {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.position-absolute {
|
|
|
+ position: absolute;
|
|
|
+}
|
|
|
+.position-fixed {
|
|
|
+ position: fixed;
|
|
|
+}
|
|
|
|
|
|
+.fixed-top {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+}
|
|
|
+.fixed-bottom {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+}
|
|
|
|
|
|
-.r-0 { right: 0; }
|
|
|
-.r-7 { right: 7px; }
|
|
|
-.r-10 { right: 10px; }
|
|
|
-.r-11 { right: 11px; }
|
|
|
+.absolute-top {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+}
|
|
|
+.absolute-bottom {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+}
|
|
|
+.absolute-right {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ right: 0;
|
|
|
+ transform: translateY(-50%);
|
|
|
+}
|
|
|
+.absolute-left {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 0;
|
|
|
+ transform: translateY(-50%);
|
|
|
+}
|
|
|
|
|
|
-.b-0 { bottom: 0; }
|
|
|
-.b-7 { bottom: 7px; }
|
|
|
-.b-10 { bottom: 10px;}
|
|
|
+.absolute-center {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+}
|
|
|
+.absolute-tr {
|
|
|
+ position: absolute;
|
|
|
+ top: -1px;
|
|
|
+ right: -1px;
|
|
|
+}
|
|
|
+.absolute-tl {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+}
|
|
|
|
|
|
+.t-0 {
|
|
|
+ top: 0;
|
|
|
+}
|
|
|
+.t-2 {
|
|
|
+ top: 2px;
|
|
|
+}
|
|
|
+.t-3 {
|
|
|
+ top: 3px;
|
|
|
+}
|
|
|
+.t-11 {
|
|
|
+ top: 11px;
|
|
|
+}
|
|
|
+.t-14 {
|
|
|
+ top: 14px;
|
|
|
+}
|
|
|
|
|
|
-.l-0 { left: 0; }
|
|
|
-.l-7 { left: 7px; }
|
|
|
-.l-10 { left: 10px;}
|
|
|
+.r-0 {
|
|
|
+ right: 0;
|
|
|
+}
|
|
|
+.r-7 {
|
|
|
+ right: 7px;
|
|
|
+}
|
|
|
+.r-10 {
|
|
|
+ right: 10px;
|
|
|
+}
|
|
|
+.r-11 {
|
|
|
+ right: 11px;
|
|
|
+}
|
|
|
|
|
|
+.b-0 {
|
|
|
+ bottom: 0;
|
|
|
+}
|
|
|
+.b-7 {
|
|
|
+ bottom: 7px;
|
|
|
+}
|
|
|
+.b-10 {
|
|
|
+ bottom: 10px;
|
|
|
+}
|
|
|
|
|
|
+.l-0 {
|
|
|
+ left: 0;
|
|
|
+}
|
|
|
+.l-7 {
|
|
|
+ left: 7px;
|
|
|
+}
|
|
|
+.l-10 {
|
|
|
+ left: 10px;
|
|
|
+}
|
|
|
|
|
|
/* 字体行高 */
|
|
|
-.lh-10 { line-height: 10px;}
|
|
|
-.lh-12 { line-height: 12px;}
|
|
|
-.lh-13 { line-height: 13px;}
|
|
|
-.lh-14 { line-height: 14px;}
|
|
|
-.lh-15 { line-height: 15px;}
|
|
|
-.lh-16 { line-height: 16px;}
|
|
|
-.lh-17 { line-height: 17px;}
|
|
|
-.lh-18 { line-height: 18px;}
|
|
|
-.lh-19 { line-height: 19px;}
|
|
|
-.lh-20 { line-height: 20px;}
|
|
|
-.lh-21 { line-height: 21px;}
|
|
|
-.lh-22 { line-height: 22px;}
|
|
|
-.lh-23 { line-height: 23px;}
|
|
|
-.lh-24 { line-height: 24px;}
|
|
|
-.lh-25 { line-height: 25px;}
|
|
|
-.lh-26 { line-height: 26px;}
|
|
|
-.lh-27 { line-height: 27px;}
|
|
|
-.lh-28 { line-height: 28px;}
|
|
|
-.lh-31 { line-height: 31px;}
|
|
|
-.lh-30 { line-height: 30px;}
|
|
|
-.lh-32 { line-height: 32px;}
|
|
|
-.lh-33 { line-height: 33px;}
|
|
|
-.lh-34 { line-height: 34px;}
|
|
|
-.lh-35 { line-height: 35px;}
|
|
|
-.lh-36 { line-height: 36px;}
|
|
|
-.lh-37 { line-height: 37px;}
|
|
|
-.lh-38 { line-height: 38px;}
|
|
|
-.lh-40 { line-height: 40px;}
|
|
|
-.lh-42 { line-height: 42px;}
|
|
|
-.lh-43 { line-height: 43px;}
|
|
|
-.lh-44 { line-height: 44px;}
|
|
|
-.lh-47 { line-height: 47px;}
|
|
|
-.lh-48 { line-height: 48px;}
|
|
|
-.lh-49 { line-height: 49px;}
|
|
|
-.lh-50 { line-height: 50px;}
|
|
|
-.lh-59 { line-height: 59px;}
|
|
|
-.lh-61 { line-height: 61px;}
|
|
|
-.lh-66 { line-height: 66px;}
|
|
|
-
|
|
|
-
|
|
|
+.lh-10 {
|
|
|
+ line-height: 10px;
|
|
|
+}
|
|
|
+.lh-12 {
|
|
|
+ line-height: 12px;
|
|
|
+}
|
|
|
+.lh-13 {
|
|
|
+ line-height: 13px;
|
|
|
+}
|
|
|
+.lh-14 {
|
|
|
+ line-height: 14px;
|
|
|
+}
|
|
|
+.lh-15 {
|
|
|
+ line-height: 15px;
|
|
|
+}
|
|
|
+.lh-16 {
|
|
|
+ line-height: 16px;
|
|
|
+}
|
|
|
+.lh-17 {
|
|
|
+ line-height: 17px;
|
|
|
+}
|
|
|
+.lh-18 {
|
|
|
+ line-height: 18px;
|
|
|
+}
|
|
|
+.lh-19 {
|
|
|
+ line-height: 19px;
|
|
|
+}
|
|
|
+.lh-20 {
|
|
|
+ line-height: 20px;
|
|
|
+}
|
|
|
+.lh-21 {
|
|
|
+ line-height: 21px;
|
|
|
+}
|
|
|
+.lh-22 {
|
|
|
+ line-height: 22px;
|
|
|
+}
|
|
|
+.lh-23 {
|
|
|
+ line-height: 23px;
|
|
|
+}
|
|
|
+.lh-24 {
|
|
|
+ line-height: 24px;
|
|
|
+}
|
|
|
+.lh-25 {
|
|
|
+ line-height: 25px;
|
|
|
+}
|
|
|
+.lh-26 {
|
|
|
+ line-height: 26px;
|
|
|
+}
|
|
|
+.lh-27 {
|
|
|
+ line-height: 27px;
|
|
|
+}
|
|
|
+.lh-28 {
|
|
|
+ line-height: 28px;
|
|
|
+}
|
|
|
+.lh-31 {
|
|
|
+ line-height: 31px;
|
|
|
+}
|
|
|
+.lh-30 {
|
|
|
+ line-height: 30px;
|
|
|
+}
|
|
|
+.lh-32 {
|
|
|
+ line-height: 32px;
|
|
|
+}
|
|
|
+.lh-33 {
|
|
|
+ line-height: 33px;
|
|
|
+}
|
|
|
+.lh-34 {
|
|
|
+ line-height: 34px;
|
|
|
+}
|
|
|
+.lh-35 {
|
|
|
+ line-height: 35px;
|
|
|
+}
|
|
|
+.lh-36 {
|
|
|
+ line-height: 36px;
|
|
|
+}
|
|
|
+.lh-37 {
|
|
|
+ line-height: 37px;
|
|
|
+}
|
|
|
+.lh-38 {
|
|
|
+ line-height: 38px;
|
|
|
+}
|
|
|
+.lh-40 {
|
|
|
+ line-height: 40px;
|
|
|
+}
|
|
|
+.lh-42 {
|
|
|
+ line-height: 42px;
|
|
|
+}
|
|
|
+.lh-43 {
|
|
|
+ line-height: 43px;
|
|
|
+}
|
|
|
+.lh-44 {
|
|
|
+ line-height: 44px;
|
|
|
+}
|
|
|
+.lh-47 {
|
|
|
+ line-height: 47px;
|
|
|
+}
|
|
|
+.lh-48 {
|
|
|
+ line-height: 48px;
|
|
|
+}
|
|
|
+.lh-49 {
|
|
|
+ line-height: 49px;
|
|
|
+}
|
|
|
+.lh-50 {
|
|
|
+ line-height: 50px;
|
|
|
+}
|
|
|
+.lh-59 {
|
|
|
+ line-height: 59px;
|
|
|
+}
|
|
|
+.lh-61 {
|
|
|
+ line-height: 61px;
|
|
|
+}
|
|
|
+.lh-66 {
|
|
|
+ line-height: 66px;
|
|
|
+}
|
|
|
|
|
|
/* 滚动 */
|
|
|
-.over-hidden { overflow: hidden; }
|
|
|
-.scroll-x { overflow-x: scroll; -webkit-overflow-scrolling: touch; }
|
|
|
-.scroll-y { overflow-y: scroll; -webkit-overflow-scrolling: touch; }
|
|
|
+.over-hidden {
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.scroll-x {
|
|
|
+ overflow-x: scroll;
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
+}
|
|
|
+.scroll-y {
|
|
|
+ overflow-y: scroll;
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
+}
|
|
|
|
|
|
/* 边框 */
|
|
|
-.border { border: 1px solid #ECECEC;}
|
|
|
-.border-top { border-top: 1px solid #ECECEC;}
|
|
|
-.border-right { border-right: 1px solid #ECECEC;}
|
|
|
-.border-bottom { border-bottom: 1px solid #ECECEC;}
|
|
|
-.border-left { border-left: 1px solid #ECECEC;}
|
|
|
-
|
|
|
-.border-0 { border: none;}
|
|
|
-.border-top-0 { border-top: none;}
|
|
|
-.border-right-0 { border-right: none;}
|
|
|
-.border-bottom-0 { border-bottom: none;}
|
|
|
-.border-left-0 { border-left: none;}
|
|
|
+.border {
|
|
|
+ border: 1px solid #ececec;
|
|
|
+}
|
|
|
+.border-top {
|
|
|
+ border-top: 1px solid #ececec;
|
|
|
+}
|
|
|
+.border-right {
|
|
|
+ border-right: 1px solid #ececec;
|
|
|
+}
|
|
|
+.border-bottom {
|
|
|
+ border-bottom: 1px solid #ececec;
|
|
|
+}
|
|
|
+.border-left {
|
|
|
+ border-left: 1px solid #ececec;
|
|
|
+}
|
|
|
|
|
|
-.border-dashed { border-style: dashed; }
|
|
|
+.border-0 {
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+.border-top-0 {
|
|
|
+ border-top: none;
|
|
|
+}
|
|
|
+.border-right-0 {
|
|
|
+ border-right: none;
|
|
|
+}
|
|
|
+.border-bottom-0 {
|
|
|
+ border-bottom: none;
|
|
|
+}
|
|
|
+.border-left-0 {
|
|
|
+ border-left: none;
|
|
|
+}
|
|
|
|
|
|
-.border-transparent { border-color: transparent; }
|
|
|
-.border-light { border-color: #FFFFFF; }
|
|
|
-.border-dark { border-color: #000000; }
|
|
|
+.border-dashed {
|
|
|
+ border-style: dashed;
|
|
|
+}
|
|
|
|
|
|
-.border-FFCA2A { border-color: #FFCA2A; }
|
|
|
-.border-F1F1F1 { border-color: #F1F1F1; }
|
|
|
-.border-F2F2F2 { border-color: #F2F2F2; }
|
|
|
-.border-DBDBDB { border-color: #DBDBDB; }
|
|
|
-.border-E5E5E5 { border-color: #E5E5E5; }
|
|
|
-.border-FFC689 { border-color: #FFC689; }
|
|
|
+.border-transparent {
|
|
|
+ border-color: transparent;
|
|
|
+}
|
|
|
+.border-light {
|
|
|
+ border-color: #ffffff;
|
|
|
+}
|
|
|
+.border-dark {
|
|
|
+ border-color: #000000;
|
|
|
+}
|
|
|
|
|
|
+.border-FFCA2A {
|
|
|
+ border-color: #ffca2a;
|
|
|
+}
|
|
|
+.border-F1F1F1 {
|
|
|
+ border-color: #f1f1f1;
|
|
|
+}
|
|
|
+.border-F2F2F2 {
|
|
|
+ border-color: #f2f2f2;
|
|
|
+}
|
|
|
+.border-DBDBDB {
|
|
|
+ border-color: #dbdbdb;
|
|
|
+}
|
|
|
+.border-E5E5E5 {
|
|
|
+ border-color: #e5e5e5;
|
|
|
+}
|
|
|
+.border-FFC689 {
|
|
|
+ border-color: #ffc689;
|
|
|
+}
|
|
|
|
|
|
/* 文本 */
|
|
|
-.text-center { text-align: center; }
|
|
|
-.text-right { text-align: right; }
|
|
|
-.text-left { text-align: left; }
|
|
|
-.text-break { word-break: break-all; }
|
|
|
+.text-center {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.text-right {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+.text-left {
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+.text-break {
|
|
|
+ word-break: break-all;
|
|
|
+}
|
|
|
|
|
|
/** 文本溢出 **/
|
|
|
-.line-clamp-1 { text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; }
|
|
|
-.line-clamp-2 { text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
|
|
|
-.line-clamp-3 { text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
|
|
|
-
|
|
|
+.line-clamp-1 {
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ -webkit-line-clamp: 1;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.line-clamp-2 {
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.line-clamp-3 {
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ -webkit-line-clamp: 3;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
|
|
|
/** 图标尺寸 */
|
|
|
-.icon-10x10 { width: 10px; height: 10px; }
|
|
|
-.icon-11x11 { width: 11px; height: 11px; }
|
|
|
-.icon-12x12 { width: 12px; height: 12px; }
|
|
|
-.icon-13x13 { width: 13px; height: 13px; }
|
|
|
-.icon-14x14 { width: 14px; height: 14px; }
|
|
|
-.icon-15x15 { width: 15px; height: 15px; }
|
|
|
-.icon-16x16 { width: 16px; height: 16px; }
|
|
|
-.icon-17x17 { width: 17px; height: 17px; }
|
|
|
-.icon-18x18 { width: 18px; height: 18px; }
|
|
|
-.icon-19x19 { width: 19px; height: 19px; }
|
|
|
-.icon-20x20 { width: 20px; height: 20px; }
|
|
|
-.icon-22x22 { width: 22px; height: 22px; }
|
|
|
-.icon-24x24 { width: 24px; height: 24px; }
|
|
|
-.icon-26x26 { width: 26px; height: 26px; }
|
|
|
-.icon-28x28 { width: 28px; height: 28px; }
|
|
|
-.icon-30x30 { width: 30px; height: 30px; }
|
|
|
-.icon-33x33 { width: 33px; height: 33px; }
|
|
|
-.icon-34x34 { width: 34px; height: 34px; }
|
|
|
-.icon-36x36 { width: 36px; height: 36px; }
|
|
|
-.icon-41x41 { width: 41px; height: 41px; }
|
|
|
-.icon-44x44 { width: 44px; height: 44px; }
|
|
|
-.icon-48x48 { width: 48px; height: 48px; }
|
|
|
-.icon-50x50 { width: 50px; height: 50px; }
|
|
|
-.icon-52x52 { width: 52px; height: 52px; }
|
|
|
-.icon-56x56 { width: 56px; height: 56px; }
|
|
|
-.icon-57x57 { width: 57px; height: 57px; }
|
|
|
-.icon-58x58 { width: 58px; height: 58px; }
|
|
|
-.icon-60x60 { width: 60px; height: 60px; }
|
|
|
-.icon-64x64 { width: 64px; height: 64px; }
|
|
|
-.icon-68x68 { width: 68px; height: 68px; }
|
|
|
-.icon-70x70 { width: 70px; height: 70px; }
|
|
|
-.icon-90x90 { width: 90px; height: 90px; }
|
|
|
-.object-fit-cover {object-fit: cover}
|
|
|
+.icon-10x10 {
|
|
|
+ width: 10px;
|
|
|
+ height: 10px;
|
|
|
+}
|
|
|
+.icon-11x11 {
|
|
|
+ width: 11px;
|
|
|
+ height: 11px;
|
|
|
+}
|
|
|
+.icon-12x12 {
|
|
|
+ width: 12px;
|
|
|
+ height: 12px;
|
|
|
+}
|
|
|
+.icon-13x13 {
|
|
|
+ width: 13px;
|
|
|
+ height: 13px;
|
|
|
+}
|
|
|
+.icon-14x14 {
|
|
|
+ width: 14px;
|
|
|
+ height: 14px;
|
|
|
+}
|
|
|
+.icon-15x15 {
|
|
|
+ width: 15px;
|
|
|
+ height: 15px;
|
|
|
+}
|
|
|
+.icon-16x16 {
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+}
|
|
|
+.icon-17x17 {
|
|
|
+ width: 17px;
|
|
|
+ height: 17px;
|
|
|
+}
|
|
|
+.icon-18x18 {
|
|
|
+ width: 18px;
|
|
|
+ height: 18px;
|
|
|
+}
|
|
|
+.icon-19x19 {
|
|
|
+ width: 19px;
|
|
|
+ height: 19px;
|
|
|
+}
|
|
|
+.icon-20x20 {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+}
|
|
|
+.icon-22x22 {
|
|
|
+ width: 22px;
|
|
|
+ height: 22px;
|
|
|
+}
|
|
|
+.icon-24x24 {
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+}
|
|
|
+.icon-26x26 {
|
|
|
+ width: 26px;
|
|
|
+ height: 26px;
|
|
|
+}
|
|
|
+.icon-28x28 {
|
|
|
+ width: 28px;
|
|
|
+ height: 28px;
|
|
|
+}
|
|
|
+.icon-30x30 {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+}
|
|
|
+.icon-33x33 {
|
|
|
+ width: 33px;
|
|
|
+ height: 33px;
|
|
|
+}
|
|
|
+.icon-34x34 {
|
|
|
+ width: 34px;
|
|
|
+ height: 34px;
|
|
|
+}
|
|
|
+.icon-36x36 {
|
|
|
+ width: 36px;
|
|
|
+ height: 36px;
|
|
|
+}
|
|
|
+.icon-41x41 {
|
|
|
+ width: 41px;
|
|
|
+ height: 41px;
|
|
|
+}
|
|
|
+.icon-44x44 {
|
|
|
+ width: 44px;
|
|
|
+ height: 44px;
|
|
|
+}
|
|
|
+.icon-48x48 {
|
|
|
+ width: 48px;
|
|
|
+ height: 48px;
|
|
|
+}
|
|
|
+.icon-50x50 {
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
+}
|
|
|
+.icon-52x52 {
|
|
|
+ width: 52px;
|
|
|
+ height: 52px;
|
|
|
+}
|
|
|
+.icon-56x56 {
|
|
|
+ width: 56px;
|
|
|
+ height: 56px;
|
|
|
+}
|
|
|
+.icon-57x57 {
|
|
|
+ width: 57px;
|
|
|
+ height: 57px;
|
|
|
+}
|
|
|
+.icon-58x58 {
|
|
|
+ width: 58px;
|
|
|
+ height: 58px;
|
|
|
+}
|
|
|
+.icon-60x60 {
|
|
|
+ width: 60px;
|
|
|
+ height: 60px;
|
|
|
+}
|
|
|
+.icon-64x64 {
|
|
|
+ width: 64px;
|
|
|
+ height: 64px;
|
|
|
+}
|
|
|
+.icon-68x68 {
|
|
|
+ width: 68px;
|
|
|
+ height: 68px;
|
|
|
+}
|
|
|
+.icon-70x70 {
|
|
|
+ width: 70px;
|
|
|
+ height: 70px;
|
|
|
+}
|
|
|
+.icon-90x90 {
|
|
|
+ width: 90px;
|
|
|
+ height: 90px;
|
|
|
+}
|
|
|
+.object-fit-cover {
|
|
|
+ object-fit: cover;
|
|
|
+}
|
|
|
/* 气泡框 */
|
|
|
.bubble {
|
|
|
- display: inline-block;
|
|
|
- height: 14px;
|
|
|
- background-color: #FF7E26;
|
|
|
- border-radius: 2px;
|
|
|
- padding: 0 4px;
|
|
|
- color: #FFFFFF;
|
|
|
-
|
|
|
- white-space: nowrap;
|
|
|
- font-size: 9px;
|
|
|
- text-align: center;
|
|
|
- line-height: 14px;
|
|
|
- position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ height: 14px;
|
|
|
+ background-color: #ff7e26;
|
|
|
+ border-radius: 2px;
|
|
|
+ padding: 0 4px;
|
|
|
+ color: #ffffff;
|
|
|
+
|
|
|
+ white-space: nowrap;
|
|
|
+ font-size: 9px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 14px;
|
|
|
+ position: relative;
|
|
|
}
|
|
|
.bubble::after {
|
|
|
- content: '';
|
|
|
- display: block;
|
|
|
- width: 0;
|
|
|
- height: 0;
|
|
|
- border-style: solid;
|
|
|
- border-color: #FF7E26 transparent transparent transparent;
|
|
|
- border-width: 5px 3px 0 3px;
|
|
|
- position: absolute;
|
|
|
- top: 100%;
|
|
|
- left: 50%;
|
|
|
- transform: translateX(-50%);
|
|
|
+ content: "";
|
|
|
+ display: block;
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ border-style: solid;
|
|
|
+ border-color: #ff7e26 transparent transparent transparent;
|
|
|
+ border-width: 5px 3px 0 3px;
|
|
|
+ position: absolute;
|
|
|
+ top: 100%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
}
|
|
|
|
|
|
-
|
|
|
/**
|
|
|
微信公众号文章内图片样式处理
|
|
|
*/
|
|
|
-.rich-html * { max-width: 100% !important; }
|
|
|
-.rich-html img { height: auto !important; }
|
|
|
-
|
|
|
+.rich-html * {
|
|
|
+ max-width: 100% !important;
|
|
|
+}
|
|
|
+.rich-html img {
|
|
|
+ height: auto !important;
|
|
|
+}
|
|
|
|
|
|
/* 层级 */
|
|
|
-.zIndex-1 { z-index: 1;}
|
|
|
-.zIndex-2 { z-index: 2;}
|
|
|
-
|
|
|
+.zIndex-1 {
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+.zIndex-2 {
|
|
|
+ z-index: 2;
|
|
|
+}
|
|
|
|
|
|
/**
|
|
|
占位
|
|
|
*/
|
|
|
|
|
|
-.space-43 { height: 43px; }
|
|
|
-.space-50 { height: 50px; }
|
|
|
-.space-88 { height: 88px; }
|
|
|
-.space-89 { height: 89px; }
|
|
|
-.space-99 { height: 99px; }
|
|
|
+.space-43 {
|
|
|
+ height: 43px;
|
|
|
+}
|
|
|
+.space-50 {
|
|
|
+ height: 50px;
|
|
|
+}
|
|
|
+.space-88 {
|
|
|
+ height: 88px;
|
|
|
+}
|
|
|
+.space-89 {
|
|
|
+ height: 89px;
|
|
|
+}
|
|
|
+.space-99 {
|
|
|
+ height: 99px;
|
|
|
+}
|
刘洋