html {
-webkit-tap-highlight-color: transparent;
overflow-x: hidden;
min-width: 6.4rem;
font-size: 312.5%;
}
body {
color: #333;
font-size: .28em;
line-height: 1.5;
font-family: arial, Microsoft Yahei;
background: #f2f2f2;
webkit-touch-callout: none;
-webkit-user-select: none;
}
body, header, footer, section, div, span, p, img, a, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, em, i, b, u, del, menu, nav, fieldset, legend, article, aside, details, figcaption, hgroup, pre, code, from, blockquote, th, td, tr, hr, table, img, figure, button, input, textarea {
margin: 0;
padding: 0;
webkit-touch-callout: none;
-webkit-text-size-adjust: none;
}
@media screen and (min-width: 410px) {
html {
font-size: 345%;
}
}
@media screen and (min-width: 480px) {
html {
font-size: 469%;
}
}
@media screen and (min-width: 640px) {
html {
font-size: 625%;
}
}
@media screen and (min-width: 645px) and (-webkit-device-pixel-ratio: 3){
html {
font-size: 615%;
}
}
@media (device-height:480px) and (-webkit-min-device-pixel-ratio:2){
html {
font-size: 260%;
}
}
@media (device-height:568px) and (-webkit-min-device-pixel-ratio:2){
html {
font-size: 260%;
}
}
@media (device-height:736px) and (-webkit-min-device-pixel-ratio:2){
html {
font-size: 350%;
}
}
.more-txt-cut1 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical
}
.center-self-xy {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%)
}
.center-self-x {
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%)
}
.center-self-y {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%)
}
.scroll {
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}
::-webkit-scrollbar {
width: 0px;
}
.scroll::scrollbar{
background-color:transparent;
height: 0;
}
.scroll::-webkit-scrollbar{
background-color:transparent;
height: 0;
}
.scroll::-moz-scrollbar{
background-color:transparent;
height: 0;
}
.scroll::-o-scrollbar{
background-color:transparent;
height: 0;
}
.scroll::-ms-scrollbar{
background-color:transparent;
height: 0;
}
// 动画 进入页面 出页面 元素需要绝对定位
.fadeIn {
transform: 'translateX(0)',
opacity:1,
transition: 'all 0.6s ease 0.3s'
}
.fadeOut {
transform:'translateX(-120%)',
opacity:0.1,
transition:'all 0.3s'}
}