css em中的常规媒体查询断点。

Posted

tags:

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

/*  480px breakpoint  */
@media only screen and (min-width: 30em) {

}

/*  600px breakpoint  */
@media only screen and (min-width: 38em) {

}

/*  768px breakpoint  */
@media only screen and (min-width: 48em) {

}

/*  992px breakpoint  */
@media only screen and (min-width: 62em) {

}

/*  1382px breakpoint  */
@media only screen and (min-width: 86em) {

}

/*  high pixel ratio  */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {

}

以上是关于css em中的常规媒体查询断点。的主要内容,如果未能解决你的问题,请参考以下文章

css CSS通用设备媒体查询断点

使用 css 变量(没有 SASS/LESS)设置媒体查询的最小/最大宽度?

css Bootstrap 3媒体查询断点

让 CSS 媒体查询使用 html 文档的 em 大小而不是浏览器?

基于 Em 的 CSS 媒体查询在 Ios Mobile Safari 上显示比预期更小的分辨率

CSS媒体查询重叠的规则是啥?