Lösung für das Problem der unvollständigen Anzeige des Inhalts der ausgewählten Dropdown-Box in HTML und der teilweisen Abdeckung
|
Heute ist mir ein Problem aufgefallen: Der Inhalt des Dropdown-Felds in der Abfrageleiste war zu lang, sodass ein Teil davon abgedeckt war. Ich habe ein paar Informationen nachgeschlagen, bei manchen wurde gesagt, man solle eine Funktionssteuerung verwenden, bei manchen eine Ereignissteuerung, manches habe ich nicht verstanden und manche waren zu kompliziert in der Umsetzung. Später fragte ich einen Kollegen, ob es ein paar einfache Methoden gäbe. Er sagte mir, ich solle das Titelattribut in die Option einfügen. Also probierte ich seine Methode aus und fand schließlich heraus, dass diese Methode funktioniert. Deshalb möchte ich es aufschreiben, damit ich es nicht vergesse. 1. Die spezifischen Beispiele sind wie folgt Code kopieren Der Code lautet wie folgt:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <Kopf> <meta http-equiv="Inhaltstyp" content="text/html; charset=utf-8" /> <title>Lösung für die unvollständige Anzeige des Inhalts ausgewählter Dropdown-Felder in HTML</title> <style type="text/css"> #Bereichsoption{ Breite: 140px; } </Stil> </Kopf> <body style="Breite: 80 %; Höhe: 100px; Textausrichtung: Mitte;"> <div id="div_auswahl"> <label for="area">Buchstaben:</label> <select id="Bereich" name="Bereich" style="width:150px;"> <option value="0">Alle</option> <option value="1" title="AAAAAAAAAAAAAAAAAAAAAAAAAAAA">AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA</option> <option value="2" title="BBBBBBBBBBBBBBBBBBBBBBBBBBBB">BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB</option> <option value="3" title="CCCCCCCCCCCCCCCCCCCCCCCCCC">CCCCCCCCCCCCCCCCCCCCCCCCCCCC</option> <option value="4" title="DDDDDDDDDDDDDDDDDDDDDDDDDD">DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD</option> <option value="5" title="EEEEEEEEEEEEEEEEEEEEEEEE">EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE</option> <option value="6" title="FFFFFFFFFFFFFFFFFFFFFFFFFFFF">FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF</option> <option value="7" title="GGGGGGGGGGGGGGGGGGGGGGGGGGGGGG">GGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGG</option> <option value="8" title="HHHHHHHHHHHHHHHHHHHHHHHHHHHHH">HHHHHHHHHHHHHHHHHHHHHHHHHHH</option> <option value="9" title="IIIIIIIIIIIIIIIIIIIIIIIIIIIIII">IIIIIIIIIIIIIIIIIIIIIIIIIIIIII</option> </Auswählen> </div> </body> </html> 2. Beispielergebnisse  3. Dynamische Daten Code kopieren Der Code lautet wie folgt:<div id="div_auswahl"> <label for="area">Provinz:</label> <select id="Bereich" name="Bereich" style="width:150px;"> <option value="0">Alle</option> <c:forEach Elemente="${Liste}" var="Bereich"> <option value="${area.areaCode}" title="${area.areaName}">${area.areaName}</option> </c:fürJeden> </Auswählen> </div> |
>>: Implementierung des MySQL Shell import_table-Datenimports
Artikel empfehlen
So verwenden Sie Vuex in einem Vue-Projekt
Inhaltsverzeichnis Was ist Vuex? Vuex-Nutzungszyk...
Zwei Beispiele für die Verwendung von Symbolen in Vue3
Inhaltsverzeichnis 1. Verwenden Sie SVG 2. Verwen...
Detaillierte Erklärung der Unterschiede zwischen ähnlichen Tags und Attributen in HTML
【1】Tags <i></i> und <em></em...
So schreiben Sie hochwertigen JavaScript-Code
Inhaltsverzeichnis 1. Einfach zu lesender Code 1....
So konvertieren Sie Chinesisch in HTML in UTF-8
In HTML kann die chinesische Phrase „學好好學“ als „學...
Verwendung von „align-content“ im Zeilenumbruchbereich des Flex-Layouts
1. Das in diesem Artikel implementierte Effektdia...
So konvertieren Sie MySQL horizontal in vertikal und vertikal in horizontal
Daten initialisieren Tabelle löschen, wenn `test_...
MySQL 8.0.20 Installations- und Konfigurations-Tutorial unter Docker
Docker installiert MySQL Version 8.0.20 zu Ihrer ...
Befehle zum Deaktivieren und Aktivieren von MySQL-Fremdschlüsseleinschränkungen
Deaktivieren und Aktivieren von MySQL-Fremdschlüs...
Detailliertes Tutorial zum Herunterladen, Installieren und Konfigurieren von MySQL 5.7.27
Inhaltsverzeichnis 1. Schritte zum Download 2. Um...
Detaillierte Erläuterung der Sicherheitskonfigurationselemente des Docker-Daemons
Inhaltsverzeichnis 1. Testumgebung 1.1 CentOS 7 i...
Grafisches Tutorial zur Installation und Konfiguration von MySQL 8.0.18
In diesem Artikel wird das grafische Tutorial zur...
Beispielcode zur Installation von ElasticSearch und Kibana unter Docker
1. Einleitung Elasticsearch erfreut sich derzeit ...
Achten Sie bei der Webseitenerstellung auf die Verwendung von HTML-Tags
HTML hat versucht, sich von der Präsentation weg ...
Grafisches Tutorial zur Installation und Konfiguration von MySQL 5.5.27 winx64
1. Installationspaket MySQL-Dienst-Downloadadress...