Lösung zur Schnittstellenverformung beim Einstellen der Frameset-Höhe
Derzeit habe ich ein Projekt erstellt, die Schnittstelle ist wie folgt: Dies wurde mithilfe von Framesets durchgeführt. Bei der Entwicklung auf einem Breitbildschirm traten keine Probleme auf, bis ein Benutzer es auf einem 800 x 600-Computer testete und feststellte, dass die gesamte Benutzeroberfläche deformiert war. Damals war die gesamte Frameset-Seite nur 600 Pixel hoch und in den im Frameset verschachtelten Frames erschienen Bildlaufleisten, was wirklich hässlich war. Wie kann ich die Höhe des Framesets höher einstellen, sodass die verschachtelte Frameseite keine Bildlaufleiste hat, das Frameset jedoch eine Bildlaufleiste? Die Höhe des Framesets kann nicht festgelegt werden, zum Beispiel: <frameset rows="110,*" style="height: 1900px;">. Zu diesem Zeitpunkt hat die Seite noch die Höhe des Bildschirms und nicht 1900 Pixel. Auch die Einstellung der Höhe des Framesets ist ungültig. Was sollte ich tun? Ich habe Baidu viele Tage lang durchsucht, konnte aber keine Antwort finden. Daher blieb diese Frage unbeantwortet. Ich habe auch überlegt, den Künstler zu bitten, das Frameset durch DIV+CSS zu ersetzen, hatte aber Angst, dass dies zu viele Inhalte und einen zu großen Arbeitsaufwand mit sich bringen würde, sodass ich aufgeben musste. Inspiration ist eine seltsame Sache. Sie kann kommen oder auch nicht, aber wenn sie kommt, kann man sie nicht mehr aufhalten. Dieses Problem bestand etwa einen Monat lang, heute trat es plötzlich auf und zwar mit einem Iframe. Als ich das Frameset darin verschachtelte und die Höhe der IFrame-Seite festlegte, kam der Effekt deutlich zum Vorschein. Ich möchte die Lösung mit Kollegen teilen, die auf das gleiche Problem gestoßen sind, es aber nicht lösen können. 1. Frameset-Seite (inner.html) Code kopieren Der Code lautet wie folgt:<html> <frameset rows="110,*" frameborder="nein" border="0" framespacing="-4px"> <frame src="header.jsp" name="topFrame" scrolling="nein" noresize="noresize" /> <frameset cols="170,12,*" framespacing="0" frameborder="nein" border="0" id="mainFrameset"> <frame src="left.jsp" name="leftFrame"scrolling="auto" noresize="noresize" id="leftFrame"/> <frame src="narrow.jsp" scrolling="nein" noresize="noresize"/> <frame src="" name="Hauptframe" noresize="noresize" /> </frameset> </frameset> <keine Frames> </noframes> </html> 2. Iframe-Seite (outer.html) Der Schlüssel liegt darin, die Höhe dieser Seite festzulegen. Sie können sie so hoch einstellen, wie Sie möchten. Zu diesem Zeitpunkt hat auch das darin enthaltene Frameset diese Höhe. Code kopieren Der Code lautet wie folgt:<body style="Rand: 0px;Höhe: 580px;Breite: 960px;"> <iframe src="inner.html" Stil="Höhe:100%;Breite:100%;Rahmenbreite: 0px;"> </iframe> </body> |
<<: So verhindern Sie doppelte Übermittlungen in einem JQuery-Projekt
Artikel empfehlen
Mehrere Möglichkeiten, das Problem des Schwebens zu lösen, das dazu führt, dass die Höhe des übergeordneten Elements in CSS zusammenbricht
1. Dokumentenfluss und Floating 1. Was ist Dokume...
Die am häufigsten verwendeten HTML-Tags zum Erstellen von Webseiten
1. Optimierung häufig verwendeter HTML-Tags HTML ...
Detaillierte Erklärung zur Installation von CentOS7 mit der in Win10 integrierten virtuellen Maschine Hyper-V
1. Installieren Sie die virtuelle Maschine Hyper-...
5 MySQL-GUI-Tools, die Ihnen bei der Datenbankverwaltung empfohlen werden
Es gibt viele Datenbankverwaltungstools für MySQL...
Detaillierte Erläuterung der Multiversion-Parallelitätskontrolle großer Objekte in MySQL
MySQL 8.0: MVCC für große Objekte in InnoDB In di...
Verwenden von CSS3 zum Erzielen von Übergangs- und Animationseffekten
Warum sollten wir CSS-Animationen anstelle von JS...
Miniprogramm zur Implementierung des Paging-Effekts
In diesem Artikelbeispiel wird der spezifische Co...
Der Vue Axios Interceptor verwendet häufig die wiederholte Stornierung von Anforderungen
Einführung Im vorherigen Artikel wurden die einfa...
Implementierung einer Bildfragmentierungsladefunktion basierend auf HTML-Code
Heute werden wir einen fragmentierten Bildladeeff...
Verwenden von react-virtualized zum Implementieren einer langen Liste von Bildern mit dynamischer Höhe
Inhaltsverzeichnis Während der Entwicklung aufget...
Drei Möglichkeiten, in CSS3 eine Hintergrundunschärfe zu erzielen (Zusammenfassung)
1. Normale Hintergrundunschärfe Code: <Stil>...
Analyse und Lösungen für Probleme bei der Verwendung von Label-Tags
Ich habe kürzlich bei einer bestimmten Aufgabe das...
HTML-Framework_Powernode Java Academy
1. Rahmen In einem Browser-Dokumentfenster kann n...
Ein Beispiel zum Schreiben eines großen Sonnenwettersymbols in reinem CSS
Wirkung Das Wirkungsdiagramm sieht wie folgt aus ...
So begrenzen Sie die Anzahl der Datensätze in einer Tabelle in MySQL
Inhaltsverzeichnis 1. Lösung auslösen 2. Partitio...