布局视口相当于书,可视视口相当于放大镜,
理想视口:
<meta name="viewport" content="width=device-width" />
在媒体查询中的em和rem不是相对于父元素或根元素,它是最高级别的相对于浏览器,即1rem = 16px
@media only screen and (max-width: 50em) {
header .top ul li a {
padding: 0 1rem;
}
}
@media only screen and (min-width: 30.0625em) and (max-width: 50em) {
}
@media only screen and (max-width: 30em) {
header .top .tel,
header .top ul li:nth-child(3),
header .top ul li:nth-child(4) {
display: none;
}
}