display-mode
Baseline
2023
*
Newly available
Since â¨August 2023â©, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
* Some parts of this feature may have varying levels of support.
La caracterÃstica de medios (media feature) de CSS display-mode puede ser utilizada para probar el modo de visualización de una aplicación. Puede ser usada para proveer de una experiencia de usuario consistente entre el lanzamiento de un sitio desde una URL y desde un Ãcono del escritorio.
La caracterÃstica corresponde al miembro display del manifiesto de la aplicación web. Ambos aplican al contexto de navegación de nivel más alto y a cualquier hijo del contexto de navegación. La caracterÃstica de consulta aplica sin importar si el manifiesto de la aplicación web esta presente
Sintaxis
La caracterÃstica display-mode se especifica como un valor de palabra clave elegida de la siguiente lista.
| Modo de visualización | Descripción | Modo de visualización de reserva |
|---|---|---|
fullscreen |
Toda la área disponible de desplegado es usada y ningún agente de usuario chrome es mostrado. | standalone |
standalone |
La aplicación se vera y sentira como una aplicación independiente. Esto puede incluir que la aplicación tenga una ventana diferente, su propio Ãcono en el lanzador de aplicaciones, etc. En este modo, el agente de usuario excluirá elementos UI paara controlar la navegación, pero puede incluir otros elementos UI como la barra de estado. | minimal-ui |
minimal-ui |
La aplicación se vera y sentira como una apicación autónoma, pero tendra un conjunto mÃnimo de elementos UI para controlar la navegación. Los elementos pueden variar por navegador. | browser |
browser |
La aplicación se abre en una pestaña o nueva ventana convencional del navegador, dependiendo del navegador y la plataforma. | (none) |
Ejemplo
@media all and (display-mode: fullscreen) {
body {
margin: 0;
border: 5px solid black;
}
}
Especificaciones
| Specification |
|---|
| Media Queries Level 5 # display-modes |