神采飞阳

 

@media screen and (min-width: 1366px) and (max-width: 1920px)


可以用来写根据屏幕的尺寸改变相应的css样式。
比如:
 <div class="test"></div>
 
.test {
  width: 200px;
  height: 100px;
  border: green 1px solid;
  margin: 0 auto;
  @media screen and (max-width: 1920px) {
    background-color: green;
  }
  @media screen and (min-width: 1366px) and (max-width: 1920px) {
    background-color: red;
  }
}
在屏幕上的div快的背景颜色会根据 @media screen and (max-width: 1920px) 和@media screen and (min-width: 1366px) and (max-width: 1920px)来改变
max-width: 1920px 的意思是不超过1920px尺寸的屏幕    min-width: 1366px 超过1366px尺寸的屏幕

 

posted on 2021-10-11 22:42  神采飞阳  阅读(691)  评论(0编辑  收藏  举报

导航