Ez az írás bemutatja a beágyazott térképek reszponzívvá tételének folyamatát.
Hogyan tegyük reszponzívvá a beágyazott térképeket?
A felhasználók néhány CSS-tulajdonság használatával reszponzívan beágyazhatják a térképet HTML-be. Előbb azonban meg kell szerezni a beágyazott hivatkozást. Ebből a célból először hajtsa végre az 1. lépést, majd ágyazza be a térképet HTML-be a következőképpen:
1. lépés: Szerezze be a térkép beágyazási hivatkozását
A beágyazott térképek hivatkozásának eléréséhez először navigáljon a „ Google térkép ”:
Kattintson a ' Térkép megosztása vagy beágyazása ' választási lehetőség:
Most kattintson a „ Térkép beágyazása ” gombot a beágyazási hivatkozás lekéréséhez:
Ezt követően kattintson a „ HTML MÁSOLÁS ” kód a kód másolásához:
2. lépés: ágyazza be a térképet HTML-be
Térkép HTML-be ágyazásához először hozzon létre egy HTML-struktúrát. A HTML-ben illessze be a másolt beágyazási hivatkozást a Kimenet Az alábbi kimenetből most már látható, hogy a térkép be van ágyazva, és reszponzív is: A beágyazott térképek reagálóvá tételéhez először hozzon létre egy HTML-struktúrát, amelynek
< h1 > Hely a Google Térképen < / h1 >
< div osztály = 'konténer-térkép' >
< iframe
szélesség = '100%'
magasság = '500'
stílus = 'határ: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
>< / iframe >
< / div >
< / test >
Következtetés