媒体查询

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了媒体查询相关的知识,希望对你有一定的参考价值。

/媒体查询,参考部分Bootstrap 框架/
/当页面大于1200px 时,大屏幕,主要是PC 端/
@media (min-width: 1200px) {

}
/在992 和1199 像素之间的屏幕里,中等屏幕,分辨率低的PC/
@media (min-width: 992px) and (max-width: 1199px) {

}
/在768 和991 像素之间的屏幕里,小屏幕,主要是PAD/
@media (min-width: 768px) and (max-width: 991px) {

}
/在480 和767 像素之间的屏幕里,超小屏幕,主要是手机/
@media (min-width: 480px) and (max-width: 767px) {

}
/在小于480 像素的屏幕,微小屏幕,更低分辨率的手机/
@media (max-width: 479px) {

}

以上是关于媒体查询的主要内容,如果未能解决你的问题,请参考以下文章

CSS媒体查询及其使用

媒体查询用法及常见媒体尺寸

CSS3媒体查询总结

聊聊最近接触的媒体查询!

媒体查询

媒体查询