CSS3 view-mode media feature support in Opera Presto 2.12

W3C reference

W3C: The view-mode Media Feature

CSS3 view-mode media feature

The view-mode media feature provides a means to style a document based on the graphical presentation mode in which the document is running (e.g., fullscreen, windowed, etc). Opera Presto's support for the view-mode media feature is described in the following sections.

Values:

windowed | floating | fullscreen | maximized | minimized

Applies to:

Visual media types

Accepts min/max prefixes:

No

View modes

The view-mode media feature accepts the following enumerated values. Each view mode is defined to be exclusive of the others. For your reference, each value is hyperlinked to its place in the online W3C view-mode media feature webpage.

Value	Description	Support
windowed	This value describes a web application running in a windowed manner, which is to say with chrome and without occupying the entire screen area.	Yes
floating	This value describes a web application providing a more immersive interface, running in a windowed manner but without chrome, and with the viewport's initial background being transparent such that other system items (other applications, the display's background...) can be seen through parts of the viewport that are not being painted to.	Yes
fullscreen	This value describes a web application that is occupying the entirety of the display, including the parts normally excluded from the screen area (e.g. a fullscreen video) and without any chrome.	Yes
maximized	This value describes a web application that is occupying the entirety of the screen area but with chrome.	Yes
minimized	This value describes a web application docked or otherwise minimised, but with a dynamic graphical representation being available nevertheless (i.e., the application is not entirely hidden, or maybe its icon is still shown and it has control over what it contains). This may correspond for instance to a thumbnail of the application's content being shown.	Yes

CSS examples

@media handheld and (view-mode: floating) and (orientation: landscape) {
  color: green;
}

@media tv and (view-mode: windowed) {
  color: red;
}

@media handheld and (view-mode: fullscreen) {
  color: yellow;
}