@media,手机端
.a{
width: 200px;
height: 200px;
border: 1px;
background-color: #0000FF;
}
使用media时需要在head标签里加上
<meta name="viewport" content="width=device-width(设备的宽度),initial-scale=1.0"(缩放比例)/>
电脑的样式,大的向小的写
@media screen and (max-width:1200px) {
.a{
display: none;
}
}
@media screen and (max-width:992px) {
.a{
display: none;
}
}
/* 手机 750,640*/
/* @media screen and (max-width:768px) {
.a{
display: none;
}
}*/
手机端
html{
font-size: 13.333333333vw;/* 每100像素占这些 */100/750*100等于字体大小 750是设计图宽度,字体单位是vm
}
div{
width: 3rem;/* 像素除100 */手机端页面宽度除以100,获得页面宽度单位是rem
}

浙公网安备 33010602011771号