Durch Bootstrap verzerrte Google Maps-Bilder: Wie kann man das beheben?

Bootstrap-CSS verursacht Probleme mit Google Maps-Bildern: Eine Lösung

Problem:

Entwickler Wer Twitter Bootstrap nutzt, kommt aufgrund von CSS-Konflikten häufig zu Bildverzerrungen, insbesondere bei Google Maps-Markierungen. Die „max-width: 100 %;“ Die Regel im CSS von Bootstrap wirkt sich auf die Darstellung von Kartenbildern aus und verzerrt deren Erscheinungsbild.

Lösung:

Um dieses Problem zu beheben, können Benutzer das Bootstrap-CSS speziell für Kartenbilder überschreiben . Durch das Hinzufügen des folgenden Codes zu ihrer Seite:

#mapCanvas img {
  max-width: none;
}

Sie können Kartenbilder effektiv von den Auswirkungen von Bootstraps CSS ausschließen.

Diese Lösung zielt effektiv auf Kartenbilder ab, indem sie sie mit der Element-ID verknüpft „#mapCanvas.“ Indem Sie ihre „max-width“-Eigenschaft auf „none“ setzen, wird das Bootstrap-CSS überschrieben und das unverzerrte Erscheinungsbild von Kartenbildern wiederhergestellt.

Das obige ist der detaillierte Inhalt vonDurch Bootstrap verzerrte Google Maps-Bilder: Wie kann man das beheben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!