media Query 解决方案

1. 风险

2. 参考

2.1. make-your-html-email-5-times-more-mobile-friendly

2.1.1. minimum touch area

2.1.1.1. ios：44x44

2.1.1.2. Microsoft suggest：38x38

2.1.2. stunning images on iPhone retina Display

2.2. Comprehensive List of Browser-Specific CSS Hacks

2.3. Targeting Safari 3 with CSS and JavaScript: Safari3 Hacks & Filters

2.4. Update: Styling the Button Element with CSS Sliding Doors - now with Image Sprites and IE 8 Support

2.5. window-device-pixel-ratio

3. 兼容性

4. 问题

5. 概念

5.1. 物理分辨率

5.2. 屏幕分辨率

5.3. retina

6. 解决方法

6.1. media query

6.1.1. 参数

6.1.1.1. width

6.1.1.2. height

6.1.1.3. device-width

6.1.1.4. device-height

6.1.1.5. orientation

6.1.1.6. aspect-ratio

6.1.1.7. device-aspect-ratio

6.1.1.8. color

6.1.1.9. color-index

6.1.1.10. monochrome

6.1.1.11. resolution

6.1.1.12. scan

6.1.1.13. grid

6.1.1.14. Untitled

6.1.2. media for standard devices

6.1.3. snippets

6.2. device-pixel-ratio

6.2.1. 用法

6.2.2. device's table

6.2.3. value

6.2.3.1. 1

6.2.3.2. 1.3

6.2.3.3. 1.5

6.2.3.4. 2

6.2.4. javascript

6.2.4.1. window.devicePixelRatio