媒体查询（手机上显示不会乱）
2018-07-20 本文已影响0人
藏于心Z
例子：div{
width:800px;
height:300px;
background: red;
margin: 0 auto;
border: 10px solid green;
}
@media screen and (max-width:1000px){
div{
width:700px;
height:500px;
background: #ccc;
border:20px solid blue;
}
}
例子：
注意media screen and (之间要用空格隔开，否则的话就，没有用。
当屏幕发生变化时，根据设置的最大值宽度或者最小值宽度时，读取大括号中的代码，如：以下：
@media screen and (当屏幕发生变化，最大宽度达到某一个值的时候，比如：max-width:1000px){
会执行以下代码：
div{
width:700px;
height:500px;
background: #ccc;
border:20px solid blue;
}
}
