zoukankan      html  css  js  c++  java
  • 移动端与PC端的viewport

      第一种解析:

    • 设备像素,就是我们直觉上觉得"靠谱"的像素,这些像素为所使用的各种设备提供了正规的分辨率,并且其值可以通过(通常情况下)从screen.width/height属性中读出;
    • css像素,就是css自定义的像素,需要注意的是css像素与设备像素不是一回事;

       第二种解析:

    • CSS pixels: 浏览器使用的抽象单位, 主要用来在网页上绘制内容。
    • device pixels: 显示屏幕的的最小物理单位,每个dp包含自己的颜色、亮度。

    PPI(DPI)的计算公式:

      1 css pixels = (devicePixelRatio)^2 device pixels

      以iphone 4(960px * 640px)来作为计算的事例:

        手机屏幕的对角线等效像素 = 960^2 + 640^2

    如何获取屏幕的尺寸:

     可以通过使用screen.width/height来获取,获取出来的值就是用户屏幕的整体大小;

    度量单位:设备像素;

    浏览器:IE7&IE8都存在以css像素对其进行度量的问题;

    注意:在ios和android会存在不同的区别;

    窗口尺寸:

    window.innerWidth/Height , 浏览器窗口的整体大小,包括滚动条,当然不包括浏览器的菜单栏,地址栏,度量单位:css像素,浏览器IE7不支持,opera以设备像素进行度量。

    参考文章:详情请见于此处

  • 相关阅读:
    济南学习 Day5 T3 晚
    Codevs 1043 ==洛谷 P1004 方格取数
    济南学习 Day 5 T2 晚
    济南学习 Day 5 T1 晚
    济南学习 Day 5 T3 am
    济南学习 Day 5 T2 am
    LeetCode Weekly Contest 8
    poj-1410 Intersection
    leetcode-Warm Up Contest-Aug.21
    poj-1384 Piggy-Bank
  • 原文地址:https://www.cnblogs.com/shuman/p/3900854.html
Copyright © 2011-2022 走看看