Maison > interface Web > tutoriel CSS > Comment faire en sorte qu'une Iframe remplisse 100 % de la hauteur du navigateur ?

Comment faire en sorte qu'une Iframe remplisse 100 % de la hauteur du navigateur ?

Patricia Arquette
Libérer: 2024-12-23 14:57:15
original
814 Les gens l'ont consulté

How to Make an Iframe Fill 100% of the Browser Height?

Iframe plein écran avec une hauteur de 100 %

Q : La hauteur iframe = 100 % est-elle prise en charge dans tous les navigateurs ?

Oui, iframe height=100% est pris en charge dans tous les principaux navigateurs (IE, Firefox, Safari) tant que l'élément parent a également une hauteur de 100 %.

Q : Est-ce que cela prendra réellement la hauteur de la page restante ?

Oui, si vous avez un autre cadre au dessus avec une hauteur fixe (par exemple 50px), l'iframe prendra la hauteur de la page restante (100% - 50px = 50 %).

Q : Comment masquer complètement les barres de défilement et définir automatiquement la hauteur de l'iframe ?

Option 1 : Débordement : Masqué

<body>
Copier après la connexion
Copier après la connexion

Option 2 : Poste : Absolu

<body>
Copier après la connexion
Copier après la connexion

Astuce : Pour masquer complètement les barres de défilement, vous pouvez définir la hauteur de l'iframe sur une valeur légèrement plus grande, par exemple 150 %, ou utiliser un hack pour forcer la barres de défilement en dehors de la page, par exemple overflow-x:hidden;overflow-y:hidden.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal