not :否定媒体查询,必须制定媒体类型
only
and :就是全部满足菜执行
,:有一个满足就成立,等价于or
如果文档宽度小于 300 像素则修改背景颜色(background-color):
@media screen and (max-width: 300px) {??? body {
???????
background-color:lightblue;??? }}
?如果像素小于700,怎隐藏字段
<!-- 移动端 -->
<style scoped>
@media only screen and (max-width: 700px) {
/* .clearfix::after{
content: '';
display: block;
clear: both;
} */
.head-logo {
width: 50px !important;
height: 50px !important;
margin-left: 30px !important;
}
.logo {
display: block !important;
width: 180px;
height: 50px;
float: right;
margin-top: 10px !important;
margin-right: 80px !important;
}
#student .list {
display: block !important;
}
.list li:last-of-type {
padding: 0 10px !important;
margin: 0 10px !important;
}
.msg {
z-index: 999;
}
.practice{
display: none;
}
}
</style>