iPhone 7 is a phone powered by iOS OS and released by Apple on Friday, September 16, 2016.
Download the Blisk applicationto test iPhone 7's cross-browser compatibility and responsive design. This phone is ready to use alone or simultaneously with many other popular devices.
Viewport size:
375 x 667 pixels
Screen size:
750px × 1334px
Device Pixel Ratio:
DPR 2
Table of contents:
- Overview and dimensions
- Key points for development and testing
- CSS-mediaquery
- Start the device in the Blisk application
- Start the device from the command prompt or terminal
- Specification (overview)
Overview and dimensions
iPhone 7 was released by Apple on Friday, September 16, 2016 and is powered by iOS OS. By default, the device comes with a web browser: Safari for iOS. The dimensions of the device are 67.1 x 138.3 x 7.1 millimeters (2.64 x 5.44 x 0.28 inches)1. The device weighs 138 g.
iPhone 7 has a Retina IPS LCD display with a 4.7-inch screen (60.9 cm)2, aspect ratio 16:9) and a screen-to-body ratio of approximately 65.6%. The display is a touchscreen, meaning it supports touch events: interactions with a finger or stylus.
1- The property is represented as width × height × thickness.
Screen size, viewport and pixel ratio
iPhone 7 has a 4.7-inch screen with a screen size (resolution): 750px × 1334px, 375px × 667px viewport1and a CSS pixel ratio of 2.
1- The property is represented as width × height.
Screen size (resolution)is the number of physical pixels on a screen.
Lookout postofViewport sizeis the number of software pixels (CSS pixels) present on a screen. Normally, viewport size is represented as viewport width in pixels to viewport height in pixels.
Device Pixel Ratio (DPR)ofCSS-pixelforholdis the ratio of physical pixels (screen size or resolution) to CSS pixels (viewport). Depending on the device specification, one CSS pixel can correspond to one or more physical pixels. Modern devices have screens with high pixel density, which results in the difference between screen size (resolution) and viewport.
Cv:
Screen size (resolution) = Viewport size x pixel ratio.
Viewport size = Screen size (resolution) / pixel ratio.
CSS Pixel Ratio = Screen Size (Resolution) / Viewport Size.
Key points for development and testing
Before you start web development or testing, make sure the web application supports a responsive viewport by using a viewport meta tag:
You can view this tag directly in the body of an HTML document on iPhone 7Bliss-app. If this viewport tag is missing, the web application will become unresponsive and the screen will flood, hiding the content from the users and creating a poor user experience.
The device form factor represents its primary orientation as portrait. Landscape orientation is also popular on the iPhone 7 and should be seriously considered when developing or testing web applications on any mobile phone.
You should also keep in mind that users will manipulate your web application on the iPhone 7 with a finger and stylus because this device has a touchscreen that supports touch events. It is important to remember that users can interact with multiple fingers (multi-touch) and gestures: single tap, multi-tap, swipe, pinch, stretch, zoom, etc. Users will most likely use gestures on small touch screens because of hassle-free interaction and good user experience.
CSS-mediaquery
Use the CSS media queries below to apply custom CSS properties to iPhone 7 and devices with the same displays:
iPhone 7 Media Query for my width:
iPhone 7 Media Query for Minimum Height:
iPhone 7 Media Query for landscape orientation:
iPhone 7 Media Query for Portrait Orientation:
iPhone 7 media query with unit pixel ratio:
Start the device in the Blisk application
iPhone 7 is ready to use in the Blisk app, where you can develop web applications and test compatibility between browsers, use this phone as a standalone device or simultaneously with other devices.Get started with Blisk...
- Download the latest version.
- Launch developer mode from the toolbar (screenshot below).
- Click on Device Manager (screenshot below).
- to electiPhone 7from the list.
- ClickLaunch Devices.
Start the device from the command prompt or terminal
You can launch iPhone 7 in the Blisk app from the Command Prompt (Windows) or Terminal (macOS or Linux) to develop web applications and test cross-browser compatibility on a standalone device or concurrently with other devices.Learn more...
- Download the latest version.
- Launch Developer Mode from the toolbar.
- Click on Menu:Unit set ➜ Part set.
- to electCommandoone clickFollowing.
- Copy the generated command.
- Launch the command prompt or terminal, paste the command and run it.
Specification (overview)
| Publication date | Friday September 16, 2016 |
| Sell | Appel |
| Type of device | telephone |
| Operating system | iOS |
| Screen | Retina IPS-LCD, 60,9 cm2, 16:9, ~65.6% screen-to-body ratio |
| Screen size (resolution) Width | 750 pixels |
| Screen size (resolution) Height | 1334px |
| Viewport width | 375 pixels |
| View height | 667 pixels |
| CSS-pixelforhold | 2 |
| Screen size | 4,7 inch |
| Pixels pr. tomme | 326 PPI |
| Dimensions (mm) | 67,1 mm× 138,3 mm× 7,1 mm |
| Dimensions (inches) | 2,64 inch x 5,44 inch x 0,28 inch |
| Weight unit | 138 gr |
