首页 > 代码库 > CSS @media

CSS @media

例 1

.outside{    width: 500px;    height: 300px;}/*写一个色块,x>1000黄色,800<x<1000绿色,500<x<800红色,x<500灰色*/@media screen and (max-width: 500px){    .outside{        background: gray;    }}@media screen and (min-width: 500px) and (max-width: 800px){    .outside{        background: red;    }}@media screen and (min-width: 800px) and (max-width: 1000px){    .outside{        background: green;    }}@media screen and (min-width: 1000px){    .outside{        background: yellow;    }}

 

 

可以把min-width和max-width理解为区间。

 

CSS @media