| 提交 | 用户 | age | ||
| 3ac5f2 | 1 | /*@import "../js/app/toast/toast.css";*/ |
| J | 2 | html{ |
| 3 | -webkit-tap-highlight-color: rgba(0,0,0,0); | |
| 4 | word-break: break-all; | |
| 5 | -webkit-text-size-adjust:none; | |
| 6 | text-size-adjust:none; | |
| 7 | } | |
| 8 | a,address,b,big,blockquote,body,center,cite,code,dd,del,div,dl,dt,em,fieldset,font,form,h1,h2,h3,h4,h5,h6,html,i,iframe,img,ins,label,legend,li,ol,p,pre,small,span,strong,u,ul,var { | |
| 9 | margin: 0; | |
| 10 | padding: 0 | |
| 11 | } | |
| 12 | html,input,textarea,select{font-family: -apple-system-font, Helvetica Neue, Helvetica, STHeiTi, Microsoft Yahei, sans-serif;} | |
| 13 | body{ | |
| 14 | font: 0.8785vw/1.5 arial,Microsoft YaHei,"\u5b8b\u4f53",sans-serif; | |
| 15 | -webkit-font-smoothing: antialiased; | |
| 16 | color: #333; | |
| 17 | background: #f2f2f2; | |
| 18 | } | |
| 19 | a {color: #333;text-decoration: none;} | |
| 20 | ol,ul{list-style: none;} | |
| 21 | .flex { | |
| 22 | display: box; | |
| 23 | display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ | |
| 24 | display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ | |
| 25 | display: -ms-flexbox; /* TWEENER - IE 10 */ | |
| 26 | display: -webkit-flex; /* NEW - Chrome */ | |
| 27 | display: -moz-flex; | |
| 28 | display: -ms-flex; | |
| 29 | display: -o-flex; | |
| 30 | display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */ | |
| 31 | } | |
| 32 | ||
| 33 | .flex-1 { | |
| 34 | -webkit-box-flex: 1; | |
| 35 | flex: 1; | |
| 36 | -webkit-flex: 1; | |
| 37 | } | |
| 38 | .w1{width: 0.0732vw;}.h1{height: 0.0732vw;} | |
| 39 | ||
| 40 | .flex-center { | |
| 41 | justify-content: center; | |
| 42 | -webkit-justify-content: center; | |
| 43 | align-items: center; | |
| 44 | -webkit-align-items: center; | |
| 45 | } | |
| aeb317 | 46 | /* 水平居中 */ |
| J | 47 | .flex-align-center{ |
| 48 | justify-content: center; | |
| 49 | -webkit-justify-content: center; | |
| 50 | } | |
| 51 | /* 水平居左 */ | |
| 52 | .flex-align-start{ | |
| 53 | justify-content: start; | |
| 54 | -webkit-justify-content: start; | |
| 55 | } | |
| 56 | /* 水平居右 */ | |
| 57 | .flex-align-end{ | |
| 58 | justify-content: end; | |
| 59 | -webkit-justify-content: end; | |
| 60 | } | |
| 3ac5f2 | 61 | .flex-ver {-webkit-align-items: center;align-items: center;} |
| J | 62 | .flex-col {-webkit-flex-flow: column;flex-flow: column;} |
| 63 | .flex-end{ | |
| 64 | -webkit-justify-content: flex-end; | |
| 65 | justify-content: flex-end; | |
| 66 | } | |
| 67 | ||
| 68 | /* flex 换行 */ | |
| 69 | .flex-wrap { | |
| 70 | flex-wrap: wrap; | |
| 71 | -webkit-flex-wrap: wrap; | |
| 72 | } | |
| 73 | ||
| 74 | /* flex 容器（设置为flex）内子元素向两边顶齐平分 */ | |
| 75 | .flex-sb { | |
| 76 | justify-content: space-between; | |
| 77 | -webkit-justify-content: space-between; | |
| 78 | } | |
| 79 | ||
| 80 | /* flex 容器（设置为flex）内子元素向两边平分 */ | |
| 81 | .flex-sa { | |
| 82 | justify-content: space-around; | |
| 83 | -webkit-justify-content: space-around; | |
| 84 | } | |
| 85 | ||
| 86 | /* 容器（设置为flex）内子元素靠最后对齐（水平时比较像右浮动） */ | |
| 87 | .flex-jcfe { | |
| 88 | justify-content: flex-end; | |
| 89 | -webkit-justify-content: flex-end; | |
| 90 | } | |
| 91 | ||
| 92 | /* 容器（设置为flex）内子元素靠最前对齐（水平时比较像左浮动） */ | |
| 93 | .flex-jcfs { | |
| 94 | justify-content: flex-start; | |
| 95 | -webkit-justify-content: flex-start; | |
| 96 | } | |
| 97 | ||
| 98 | /* 容器（设置为flex）内子元素等高 */ | |
| 99 | .flex-ais { | |
| 100 | align-items: stretch; | |
| 101 | -webkit-align-items: stretch; | |
| 102 | } | |
| 103 | ||
| 104 | /* 容器（设置为flex）内子元素置底 */ | |
| 105 | .flex-aife { | |
| 106 | align-items: flex-end; | |
| 107 | -webkit-align-items: flex-end; | |
| 108 | } | |
| 109 | ||
| 110 | .ell{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;} | |
| 111 | .wsnw{white-space: nowrap;} | |
| 112 | ||
| 113 | input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{ | |
| 114 | color: #999; | |
| 115 | } | |
| 116 | /* css arrow */ | |
| 117 | .arrow{ | |
| 118 | display: inline-block; | |
| 119 | border: solid #29262A; | |
| 120 | border-width: 0.0732vw 0.0732vw 0 0; | |
| 121 | } | |
| 122 | .ar-h24{width: 0.6589vw;height: 0.6589vw;} | |
| 123 | .ar-h20{width: 0.5124vw;height: 0.5124vw;} | |
| 124 | .arrow-right{-webkit-transform: rotate(45deg);transform: rotate(45deg);} | |
| 125 | .arrow-down{-webkit-transform: rotate(135deg) translate(-0.1464vw,0.1464vw);transform: rotate(135deg) translate(-0.1464vw,0.1464vw);} | |
| 126 | .ac{text-align: center;}.ar{text-align: right;} | |
| 127 | .hide{display: none!important;} | |
| 128 | ||
| 129 | input::-webkit-outer-spin-button, | |
| 130 | input::-webkit-inner-spin-button { | |
| 131 | -webkit-appearance: none; | |
| 132 | } | |
| 133 | input[type="number"]{ | |
| 134 | -moz-appearance: textfield; | |
| 135 | } | |
| 136 | /*page common*/ | |
| 137 | ||
| 138 | .w{ | |
| 139 | width: 93.7042vw; | |
| 140 | margin: 0 auto; | |
| 141 | } | |
| 142 | .fl{float: left} | |
| 143 | .fr{float: right} | |
| 144 | .al{text-align: left;}.ar{text-align: right;} | |
| 145 | .tdu{text-decoration: underline;} | |
| 146 | .clear,.clr,.clearfix:after { | |
| 147 | content: ''; | |
| 148 | display: block; | |
| 149 | overflow: hidden; | |
| 150 | clear: both; | |
| 151 | height: 0; | |
| 152 | line-height: 0; | |
| 153 | font-size: 0; | |
| 154 | } | |
| 155 | .blue{color: #0084e6;} | |
| 156 | /* 浅色#23a9fd 中间#218ad9 深色#005bbd */ | |
| 157 | .gray{color: #666;}.g4{color: #444;} | |
| 158 | .red{color: red;}.green{color: green;} | |
| 159 | .orange{color: #FC6621;} | |
| 160 | .vm{vertical-align: middle;} | |
| 161 | .ml20{margin-left: 1.4641vw;} | |
| 162 | .fs16{font-size: 1.1713vw;} | |
| 163 | ||
| 164 | /* ====================================================================== */ | |
| 165 | .fs20{font-size:1.4641vw} | |
| 166 | html, body{ | |
| 167 | min-height: 100%; | |
| 168 | } | |
| 169 | body{ | |
| 170 | height: 100%; | |
| 171 | /* background: #000; */ | |
| 172 | -webkit-text-size-adjust: 100% !important; | |
| 173 | text-size-adjust: 100% !important; | |
| 174 | -moz-text-size-adjust: 100% !important; | |
| 175 | } | |
| 176 | #app{ | |
| 177 | user-select: none; | |
| 178 | -webkit-user-select: none; | |
| 179 | /* width: 100vw; | |
| 180 | height: 100vh; | |
| 181 | background: url(../imgs/bg.jpg) no-repeat; | |
| 182 | background-size: 100% 100%; | |
| 183 | min-height: 88.1406vw; */ | |
| 184 | } | |
| 185 | /* .appContainer{ | |
| 186 | position: relative;width: 100%; | |
| 187 | min-height: 88.1406vw; | |
| 188 | } */ | |
| 189 | ||
| 190 | /* 遮罩 */ | |
| 191 | .mask{ | |
| 192 | position: fixed; | |
| 193 | top: 0; | |
| 194 | left: 0; | |
| 195 | right: 0; | |
| 196 | bottom: 0; | |
| 197 | z-index: 10; | |
| bb2b08 | 198 | background: rgba(0,0,0,0.67); |
| 3ac5f2 | 199 | } |
| J | 200 | body{ |
| 201 | overflow: hidden; | |
| 202 | } | |
| 203 | /* 页面通用样式 */ | |
| 204 | .page { | |
| 205 | width: 100vw; | |
| 206 | height: 100vh; | |
| bb2b08 | 207 | /* width: 1440px; |
| J | 208 | height: 900px; */ |
| 3ac5f2 | 209 | background-color: rgba(34,123,235,1); |
| J | 210 | box-sizing: border-box; |
| 211 | padding: 0 23px 42px 23px; | |
| 212 | } | |
| 213 | ||
| 214 | .page_header { | |
| 215 | min-height: 100px; | |
| 216 | } | |
| 217 | ||
| 218 | .page_logo_1 { | |
| 219 | width: 50px; | |
| 220 | height: 45px; | |
| 221 | display: block; | |
| 222 | } | |
| 223 | ||
| 224 | .page_logo_2 { | |
| 225 | width: 132px; | |
| 226 | height: 50px; | |
| 227 | display: block; | |
| 228 | margin-left: 10px; | |
| 229 | } | |
| 230 | ||
| 231 | .page_date { | |
| 232 | line-height: 28px; | |
| 233 | color: rgba(255,255,255,1); | |
| 234 | font-size: 20px; | |
| 235 | font-family: PingFangSC-regular; | |
| 236 | text-align: right; | |
| bb2b08 | 237 | margin-left: 33px; |
| 3ac5f2 | 238 | } |
| J | 239 | |
| 240 | .page_week {} | |
| 241 | ||
| 242 | .page_day {} | |
| 243 | ||
| 244 | .page_time { | |
| 245 | line-height: 75px; | |
| 246 | color: rgba(255,255,255,1); | |
| 247 | font-size: 54px; | |
| 248 | font-family: PingFangSC-regular; | |
| 249 | margin-left: 15px; | |
| 250 | text-align: right; | |
| 251 | } | |
| 252 | ||
| 253 | .page_container { | |
| 254 | width: 100%; | |
| 255 | height: calc( 100% - 100px ); | |
| bb2b08 | 256 | } |
| J | 257 | |
| 258 | .btn_ani { | |
| 259 | animation-name: anim_scale; | |
| 260 | animation-duration: 1.1s; | |
| 261 | animation-iteration-count: infinite; | |
| 262 | } | |
| 263 | ||
| 264 | @keyframes anim_scale { | |
| 265 | 0% { | |
| 266 | scale: 1; | |
| 267 | } | |
| 268 | 50% { | |
| 269 | scale: 1.05; | |
| 270 | } | |
| 271 | 100% { | |
| 272 | scale: 1; | |
| 273 | } | |
| 3ac5f2 | 274 | } |
