Ist Ihr Google Maps-Bild durch Twitter Bootstrap verzerrt? Hier erfahren Sie, wie Sie das Problem lösen können.

Google Maps-Bildverzerrung durch Twitter-Bootstrap-CSS

Die Verwendung von Twitter-Bootstrap kann zu unerwarteten Bildverzerrungen in Google Maps führen, insbesondere bei Markierungen. Dieses Problem entsteht durch das Bootstrap-CSS, das die folgende Erklärung enthält:

<code class="css">img {
    max-width: 100%;
}</code>

Wenn diese Eigenschaft auf Google Maps-Bilder angewendet wird, werden Markierungsbilder unverhältnismäßig skaliert. Das Deaktivieren der Eigenschaft „max-width“ behebt das Problem, wie sich bei der Verwendung von Firebug zeigt.

Um zu verhindern, dass Bootstrap-CSS Google Maps-Bilder beeinträchtigt, können Sie die folgende Lösung implementieren:

<code class="css">#mapCanvas img {
  max-width: none;
}</code>

Von Durch Überschreiben des Bootstrap-CSS für Bilder im Kartencontainer (gekennzeichnet durch #mapCanvas) können Sie das normale Erscheinungsbild von Markierungsbildern wiederherstellen. Diese Lösung stellt sicher, dass Bootstrap-Stile keine Auswirkungen auf Google Maps-Bilder haben, sodass sowohl Bootstrap als auch Google Maps wie vorgesehen funktionieren.

Das obige ist der detaillierte Inhalt vonIst Ihr Google Maps-Bild durch Twitter Bootstrap verzerrt? Hier erfahren Sie, wie Sie das Problem lösen können.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!