In diesem Artikel wird der Prozess demonstriert, mit dem eingebettete Karten responsiv gemacht werden.
Wie mache ich eingebettete Karten responsiv?
Benutzer können die Karte mithilfe einiger CSS-Eigenschaften responsiv in HTML einbetten. Allerdings ist es notwendig, zuerst den eingebetteten Link abzurufen. Zu diesem Zweck führen Sie zunächst Schritt 1 aus und betten dann die Karte wie folgt in HTML ein:
Schritt 1: Holen Sie sich den Einbettungslink der Karte
Um den Link zu den eingebetteten Karten zu erhalten, navigieren Sie zunächst zu „ Google Maps ”:
Klick auf das ' Karte teilen oder einbetten ' Möglichkeit:
Klicken Sie nun auf „ Betten Sie eine Karte ein ”-Button, um den Einbettungslink zu erhalten:
Klicken Sie anschließend auf „ HTML KOPIEREN ” Code zum Kopieren des Codes:
Schritt 2: Betten Sie die Karte in HTML ein
Um eine Karte in HTML einzubetten, erstellen Sie zunächst eine HTML-Struktur. Fügen Sie im HTML den kopierten Einbettungslink ein Ausgabe Aus der folgenden Ausgabe ist nun ersichtlich, dass die Karte eingebettet wurde und auch reagiert: Um eingebettete Karten responsiv zu machen, erstellen Sie zunächst eine HTML-Struktur mit einem
< h1 > Standort auf Google Maps < / h1 >
< div Klasse = „Container-Karte“ >
< iframe
Breite = '100%'
Höhe = „500“
Stil = „Grenze:0“
src = „https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d328204.9017193669!2d-74.30933777495511!3d40.69753995297432!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.
„1!3m3!1m2!1s0x89c24fa5d33f083b%3A0xc80b8f06e177fe62!2sNew%20York%2C%20NY%2C%20USA!5e1!3m2!1sen!2s!4v1695734740712!5m2!1sen!2s“
>< / iframe >
< / div >
< / Körper >
Abschluss