CSS - Screen

> (World Wide) Web - (W3|WWW) > CSS - Cascading Style Sheets - Markup Language (HTML|XML) Skin

1 - About

A screen is a (visual) media type.

A user agent on a screen generally impose a minimum width and choose an initial width based on the dimensions of the viewport.

Advertising

3 - Resolution

The CSS resolution is always given in Css Pixel (not in Hardware pixel)

The CSS screen resolution is determined by:

  • by the pixel ratio.
  • and by the viewport. A screen impose a minimum width and choose an initial width based on the dimensions of the viewport.

Example:

  • A mobile screen has a resolution of 1920 x 1080 px (hardware pixel) with a device pixel ratio of 2.
  • The maximum width of the viewport is CSS pixel is then:
<MATH> \text{Maximum Width in CSS Pixel} = \frac{\displaystyle 1920}{\displaystyle 2} = 960 </MATH>

4 - Q & A

Why would the same page look different on the screens with identical resolutions ?

web/css/screen.txt ยท Last modified: 2019/02/09 11:40 by gerardnico