Html-移动端与响应式

width: 15px;

height: 15px;

background-image: url(“…/imag/xiangyou1.png”);

background-position: center center;

background-size: 100% auto;

background-repeat: no-repeat;

}

.picture {

width: 80%;

height: 90%;

height: 281px;

flex: 3;

display: flex;

flex-direction: row;

justify-content: space-around;

margin: 0px;

}

.picture .img_1 {

flex: 1;

}

.picture .img_2 {

flex: 1;

}

.picture .img_3 {

flex: 1;

}

• {

margin: 0;

padding: 0;

}

.nav {

width: 100%;

height: 44px;

background-color: rgba(0, 0, 0, 0.8);

display: flex;

justify-content: center;

align-items: center;

font-family: “宋体”;

font-size: 12px;

}

.nav a {

color: #fff;

/* 设置a标签下划线为none */

text-decoration: none;

width: 102px;

text-align: center;

}

.nav > .logo {

height: 44px;

width: 44px;

background-image: url(“…/imag/logo.png”);

background-repeat: no-repeat;

background-position: center;

}

.nav > .search {

width: 44px;

height: 44px;

background-image: url(“…/imag/search.png”);

background-repeat: no-repeat;

background-position: center;

}

.nav > .buy {

width: 44px;

height: 44px;

background-image: url(“…/imag/buy.png”);

background-repeat: no-repeat;

background-position: center;

}

label {

width: 44px;

height: 44px;

}

.togglebtn {

width: 44px;

display: none;

position: relative;

flex-direction: column;

justify-content: center;

align-items: center;

}

.togglebtn > .line {

width: 18px;

height: 1px;

background-color: #fff;

display: none;

transition: all 0.5s;

transform-origin: left center;

}

.togglebtn .line:nth-child(1) {

position: absolute;

top: 15px;

}

.togglebtn .line:nth-child(2) {

position: absolute;

top: 27px;

}

/*

设定屏幕小于768像素时的像素

*/

.navpage {

width: 100vw;

overflow: hidden;

display: flex;

height: 0vh;

transition: all 0.8s;

position: fixed;

left: 0;

top: 0;

background-color: #000;

}

.navpage .navmain {

width: 100%;

}

@