zoukankan      html  css  js  c++  java
  • 【CSS】利用宽高比例的媒体查询

    aspec-ratio

    • 取值:value (x/y)
    • 接收min/max前缀:是

    aspect-ratio描述了输出设备目标显示区域的宽高比。该值包含两个以/分隔的正整数。代表了水平像素数(第一个值)与垂直像素数(第二个值)的比例。

    device-aspect-ratio

    这个和aspect-ratio很类似,描述的是输出设备的宽高比。该值包含两个以/分隔的正整数。代表了水平像素数(第一个值)与垂直像素数(第二个值)的比例。

    这两个用于媒体查询可以解决许多宽高比例较大的安卓机器的适配问题。
    比如这样:

    /*宽屏Android*/
    @media only screen and (min-aspect-ratio: 6/10){
        .packetTop {
          position: relative;
          margin: 18% 11% 20px;
        }
        .packetBot {
          display: none;
          position: relative;
          margin: 10% 11% 20px;
        }
    }
    

      

    原文:https://www.cnblogs.com/lijie33402/p/4656838.html

  • 相关阅读:
    bugku web基础$_POST
    bugku web基础$_GET
    bugku 计算器
    bugku web2
    i春秋Musee de X
    i春秋Hello World
    i春秋登录
    i春秋Blog
    i春秋时间
    i春秋Hash
  • 原文地址:https://www.cnblogs.com/dj258/p/10234375.html
Copyright © 2011-2022 走看看