"Полный экран" <iframe>

Когда я использую следующий код для создания iframe:

<iframe src="mypage.html" style="border: 0; width: 100%; height: 100%">Your browser doesn't support iFrames.</iframe>

IFrame не проходит полностью - 10px белая "граница" окружает iframe. Как я могу это решить?

Вот изображение проблемы:

Ответы

Ответ 1

В большинстве браузеров body имеет значение по умолчанию. Попробуйте:

body {
    margin: 0;
}

на странице с iframe.

Ответ 2

Чтобы покрыть весь видовой экран, вы можете использовать:

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

~~И убедитесь, что для полей страницы в рамке установлено значение 0, например body { margin: 0; }~~ ~~body { margin: 0; }~~ - На самом деле, это не обязательно с этим решением.

Я использую это успешно, с дополнительным display:none и JS, чтобы показать его, когда пользователь нажимает на соответствующий элемент управления.

Примечание. Чтобы заполнить родительскую область просмотра вместо всего окна просмотра, измените position:fixed на position:absolute.

Ответ 3

Вы также можете использовать длину в процентах в окне просмотра, чтобы достичь этого:

5.1.2. Длины в процентах по видовому экрану: vw, vh, vmin, vmax units

Длины в процентах в окне просмотра относятся к размеру исходного содержащего блока. Когда высота или ширина исходного содержащего блока изменяется, они соответственно масштабируются.

Где 100vh представляет высоту окна просмотра, а также 100vw представляет ширину.

Пример здесь

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></iframe>

Ответ 4

Используйте frameborder="0". Вот полный пример:

    <iframe src="mypage.htm" height="100%" width="100%" frameborder="0">Your browser doesnot support iframes<a href="myPageURL.htm"> click here to view the page directly. </a></iframe>

Ответ 5

Попробуйте добавить следующий атрибут:

scrolling="no"

Ответ 6

Невозможно сказать, не видя живого примера, но попробуйте дать оба тела margin: 0px

Ответ 7

Вы можете попробовать frameborder=0.

Ответ 8

Используйте этот код вместо него:

    <frameset rows="100%,*">
        <frame src="-------------------------URL-------------------------------">
        <noframes>
            <body>
                Your browser does not support frames. To wiew this page please use supporting browsers.
            </body>
        </noframes>
    </frameset>