文字
分享

说明:

每英寸包含点的数量(dots per inch)
  • 普通屏幕通常包含96dpi,一般将2倍于此的屏幕称之为高分屏,即大于等于192dpi的屏幕,比如Mac视网膜屏就达到了192dpi(即2dppx),打印时一般会需要更大的dpi;

  • 1dppx = 96dpi

  • 1dpi ≈ 0.39dpcm

  • 1dpcm ≈ 2.54dpi

  • 1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px

示例代码:

1

2

@media screen and (min-resolution: 96dpi) { ... }

@media print and (min-resolution: 300dpi) { ... }


兼容性:

IEFirefoxChromeSafariOperaiOS SafariAndroid BrowserAndroid Chrome
6.0-8.02.0-3.44.0-28.03.1-8.115.0+3.2-8.12.1-4.4.418.0-29.0
9.0+3.5+29.0+29.0+

示例:

实例

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

<!DOCTYPE html>

<html lang="zh-cmn-Hans">

<head>

<meta charset="utf-8" />

<title>dpi_CSS参考手册_web前端开发参考手册系列</title>

<meta name="author" content="Joy Du(飘零雾雨), dooyoe@gmail.com, www.doyoe.com" />

<style>

@media screen and (min-resolution: 192dpi) {

    .normal{display:none;}

}

@media screen and (min-resolution: 72dpi) and (max-resolution: 191dpi) {

    .retina{display:none;}

}

</style>

</head>

<body>

<p class="retina">视网膜屏</p>

<p class="normal">普通屏</p>

</body>

</html>

            


运行实例 »

点击 "运行实例" 按钮查看在线实例

上一篇:<resolution>下一篇:dpcm