img usemap Attribut China Karte Link

HTML-img-Tag: definiert ein Bild, das in eine Webseite eingefügt werden soll. Es hat auch ein interessantes Usemap-Attribut.
Schauen Sie sich die Homepage von 51ditu an, dort ist eine Karte mit einer Karte von China in der Mitte. Klicken Sie mit der rechten Maustaste und laden Sie es herunter, um zu sehen, dass es nur ein gewöhnliches Bild ist.
Aber wenn man auf die Provinzen auf der Karte klickt, können unterschiedliche Ereignisse ausgelöst werden (oder unterschiedliche Links geöffnet werden), was sehr interessant ist. Es stellt sich heraus, dass das Usemap-Attribut verwendet wird.
Natürlich muss ein Map-Tag definiert werden. Der gesamte Code lautet wie folgt:

:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::3s::::::333:33333333333333333333ag33333333333333333333333333333 es333333333333333333333333333333 es33 nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht dann dann dann dann aber33333333333333333333 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 dann3 dann3 aber3 dann3 nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht dann nichtie dasen aber aber abersossoss aberstens aberstensss aberten aber abers :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::3s::::::333:33333333333333333333ag33333333333333333333333333333 es333333333333333333333333333333 es33 nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht dann dann dann dann aber33333333333333333333 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 dann3 dann3 aber3 dann3 nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht dann nichtie dasen aber aber abersossoss aberstens aberstensss aberten aber abers :::::::::::

Tipp: Sie können einen Teil des Codes vor dem Ausführen ändern

Informationen zur Bedeutung mehrerer Attribute des Bereichs-Tags im Karten-Tag finden Sie unter: http://www.w3school.com.cn/tags/tag_area.asp

Hier beachten wir noch das Shape-Attribut der Fläche. Zur Auswahl stehen Rechteck, Kreis und Polygon. Achten Sie besonders auf das Koordinatenattribut, das in Verbindung mit der Form verwendet werden muss. Die Koordinaten der oberen linken Ecke des Bildes sind „0,0“.

<<: Perfekte Lösung für das Problem, dass Navicat nach der Installation von MySQL im Docker keine Verbindung herstellen kann

>>: So entwerfen und optimieren Sie MySQL-Indizes

Vergleich der Effizienz der Dateneinfügung in MySQL

Tencent-Interview: Was sind die Gründe, warum eine SQL-Anweisung sehr langsam ausgeführt wird? ---Sehen Sie sich die Serie „Regret“ nicht an (empfohlen)

Artikel

img usemap Attribut China Karte Link

Vergleich der Effizienz der Dateneinfügung in MySQL

Klassifizierung der Farbeigenschaften von Webseiten

MySQL-Einschränkungstypen und Beispiele

So bedienen Sie Datei- und Ordnerberechtigungen unter Linux

Vue+js: Klicken Sie auf den Pfeil, um die Bilder zu wechseln

So lösen Sie die Elementbewegung, die durch einen per Hover generierten Rahmen verursacht wird

Tutorial zur Samba-Konfiguration für die Dateifreigabe im Linux-System

Detailliertes Beispiel für die JSON-Analyse mit MySQL (5.6 und darunter)

Implementierungsanweisungen zur Duplikatsprüfung und Deduplizierung von MySQL-Daten

Tencent-Interview: Was sind die Gründe, warum eine SQL-Anweisung sehr langsam ausgeführt wird? ---Sehen Sie sich die Serie „Regret“ nicht an (empfohlen)

Artikel empfehlen

CSS-Sprites-Technologie integriert mehrere Hintergründe in ein PNG-Bild CSS-Positionierung

Drei Möglichkeiten, um einen Textblinkeffekt im CSS3-Beispielcode zu erzielen

vue + node + socket io realisiert die Interaktion mehrerer Personen und gibt den gesamten Prozess frei

Einfache Kapselung von Axios und Beispielcode zur Verwendung

Umfassende Analyse des MySql-Master-Slave-Replikationsmechanismus

Lösung für das Problem der Nullspalte in der NOT IN-Füllgrube in MySQL

Vue implementiert das Hinzufügen von Wasserzeichen zu hochgeladenen Bildern

Lösung für viele Zeilenumbrüche und Wagenrückläufe in MySQL-Daten

CSS zum Implementieren von QQ-Browserfunktionen

Mit CSS3 erstellte Buchseitenumblättereffekte

10 SQL-Anweisungsoptimierungstechniken zur Verbesserung der MySQL-Abfrageeffizienz

Detaillierte Schritte zur Installation eines Hadoop-Clusters unter Linux

MySQL 8.0.19 Installations- und Konfigurations-Tutorial unter Windows 10

Detaillierte Erläuterung des Nginx-Reverse-Generation-Beispiels für verteilten Mogilefs-Speicher

Beispielanweisungen für Indizes und Einschränkungen in MySQL