zoukankan      html  css  js  c++  java
  • 如何判断dpr的倍数

    1. js中有window.devicePixelRatio可直接查看倍率。

    2. 用css技术判断dpr的倍数

      响应式设计:(媒介查询)通过设置断点来实现响应。

    • max-device-pixel-ratio:最大设备dpr
    • max-resolution:最大像素密度
    //retina1x
    @media (max--moz-device-pixel-ratio: 1.49), (-webkit-max-device-pixel-ratio: 1.49), (max-device-pixel-ratio: 1.49), (max-resolution: 143dpi), (max-resolution: 1.49dppx)
    //retina2x
    @media (min--moz-device-pixel-ratio: 1.5) and (max--moz-device-pixel-ratio: 2.49), (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 2.49),(min-device-pixel-ratio: 1.5) and (max-device-pixel-ratio: 2.49),(min-resolution: 144dpi) and (max-resolution: 239dpi),(min-resolution: 1.5dppx) and (max-resolution: 2.49dppx)
    //retina3x
    @media (min--moz-device-pixel-ratio: 2.5), (-webkit-min-device-pixel-ratio: 2.5),(min-device-pixel-ratio: 2.5), (min-resolution: 240dpi),(min-resolution: 2.5dppx)
    

      

      

  • 相关阅读:
    C#
    Jquery
    JavaScript
    JavaScript
    JavaScript
    JavaScript
    Html
    JavaScript
    (转)SC Create 创建一个Windows系统服务
    我的MyGeneration
  • 原文地址:https://www.cnblogs.com/ruchang/p/9966135.html
Copyright © 2011-2022 走看看