From the course: Creating a Responsive Web Design: Advanced Techniques

Unlock this course with a free trial

Join today to access over 22,400 courses taught by industry experts.

About this lesson

About this lesson

- [Voiceover] In this chapter, we'll focus on supporting high definition screens. Now, on older monitors and devices, the standard resolution was around 120 pixels per inch. The next big jump in screen resolution doubled the number of pixels along the height and the width, which quadruples the total number of pixels on the screen. Now the devices have a logical screen resolution as well as a physical resolution. The iPhone 6, for example, has a logical resolution of 375 pixels by 667 pixels. This is the measurement the phone uses to determine the coordinates of elements positioned on the screen. Now this measurement may also be referred to as points, or CSS pixels, because this is the measurement the CSS media query would return when querying the screen size. Now the physical pixels are the actual number of pixels used in the device's screen. Here we can see that that number for the iPhone 6 is 750 pixels by 1,334 pixels. Now when looking at a bitmap image on a standard screen, the…

Contents