轮播移动端 html,移动端轮播图

html {

font-family:"Helvetica Neue",Helvetica,STHeiTi,sans-serif;

-ms-text-size-adjust:100%;

-webkit-text-size-adjust:100%

}

html,body {

-webkit-user-select:none;

user-select:none;

width:100%

}

html,body,p,object,,applet,object,h1,h2,h3,h4,h5,h6,p,blockquote,pre,address,dl,dt,dd,ol,ul,li,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,menu,nav,output,ruby,section,summary,time,mark,audio,video,progress {

margin:0;

padding:0;

border:0;

vertical-align:baseline

}

a {

text-decoration:none;

-webkit-touch-callout:none;

background-color:transparent

}

li {

list-style:none

}

article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary {

display:block

}

audio,canvas,progress,video {

display:inline-block

}

audio:not([controls]) {

display:none;

height:0

}

[hidden],template {

display:none

}

a:active,a:hover {

outline:0

}

abbr[title] {

border-bottom:1px dotted

}

b,strong {

font-weight:bold

}

dfn {

font-style:italic

}

h1 {

font-size:2em;

margin:.67em 0

}

small {

font-size:80%

}

sub,sup {

font-size:75%;

line-height:0;

position:relative;

vertical-align:baseline

}

sup {

top:-0.5em

}

sub {

bottom:-0.25em

}

img {

border:0;

-webkit-touch-callout:none;

}

svg:not(:root) {

overflow:hidden

}

figure {

margin:1em 40px

}

hr {

-moz-box-sizing:content-box;

box-sizing:content-box;

height:0

}

pre {

overflow:auto

}

code,kbd,pre,samp {

font-family:monospace,monospace;

font-size:1em

}

a,button,input,optgroup,select,textarea {

-webkit-tap-highlight-color:rgba(0,0,0,0);

}

button,input,optgroup,select,textarea {

color:inherit;

font:inherit;

margin:0;

-webkit-appearance:none;

outline:none;

line-height:normal

}

button {

overflow:visible

}

button,select {

text-transform:none

}

button,html input[type="button"],input[type="reset"],input[type="submit"] {

-webkit-appearance:button;

cursor:pointer

}

button[disabled],html input[disabled] {

cursor:default

}

button::-moz-focus-inner,input::-moz-focus-inner {

border:0;

padding:0

}

input,textarea {

outline:none;

border:none;

}

input {

line-height:normal

}

input[type="checkbox"],input[type="radio"] {

box-sizing:border-box;

padding:0

}

input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button {

height:auto

}

input[type="search"] {

-webkit-appearance:textfield;

-moz-box-sizing:content-box;

-webkit-box-sizing:content-box;

box-sizing:content-box

}

input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration {

-webkit-appearance:none

}

fieldset {

border:1px solid silver;

margin:0 2px;

padding:.35em .625em .75em

}

legend {

border:0;

padding:0

}

textarea {

overflow:auto

}

optgroup {

font-weight:bold

}

table {

border-collapse:collapse;

border-spacing:0

}

td,th {

padding:0

}

/*轮播块*/

.Banner {

width:100%;

position:relative;

}

.Banner .B-img {

width:100%;

overflow:hidden;

}

.Banner .B-img ul {

width:1000%;

}

.Banner .B-img ul li {

float:left;

}

.Banner .B-img ul li img {

width:10rem;

height:6.65625rem;

}

.Banner .B-dir {

width:100%;

height:0.625rem;

position:absolute;

bottom:0.3125rem;

z-index:10;

}

.Banner .B-dir ul {

display:flex;

justify-content:center;

align-items:center;

overflow:hidden;

height:0.625rem;

}

.Banner .B-dir ul li {

margin-left:0.3125rem;

width:0.375rem;

height:0.375rem;

background-color:white;

border-radius:50%;

}

.Banner .B-dir ul li.on {

background-color:#00A0EA;

}