Como hacer un <iframe> en Full Screen

with an additional display:none and JS to show it when the user clicks the appropriate control.

<iframe src="mypage.html" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;"> Your browser doesn't support iframes </iframe>

You can also use viewport-percentage lengths to achieve this. The viewport-percentage lengths are relative to the size of the initial containing block. When the height or width of the initial containing block is changed, they are scaled accordingly. Where 100vh represents the height of the viewport, and likewise 100vw represents the width.

body {
    margin: 0;            /* Reset default margin */
iframe {
    display: block;       /* iframes are inline by default */
    background: #000;
    border: none;         /* Reset default border */
    height: 100vh;        /* Viewport-relative units */
    width: 100vw;
  • iframe, fullscreen
  • 17 Los Usuarios han Encontrado Esto Útil
¿Fue útil la respuesta?

Artículos Relacionados

UTF-8 Encoding Debugging Chart

Debugging Chart Mapping Windows-1252 Characters to UTF-8 Bytes to Latin-1 Characters Table for...

www htaccess redirect

RewriteEngine On RewriteCond %{HTTP_HOST} !^www\. RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1...

HTML redirect

La opción de redirección por medio de código HTML es una de las opciones más populares y simples...