您的 Google 地圖圖片是否被 Twitter Bootstrap 扭曲了？這是解決問題的方法。

由Twitter Bootstrap CSS 導致的Google 地圖圖片失真

使用Twitter Bootstrap 可能會導致Google 地圖中出現意外的圖片失真，特別是影響標記。此問題由 Bootstrap CSS 引起，其中包含以下聲明：

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

當此屬性應用於 Google 地圖圖像時，它會不成比例地縮放標記圖像。停用 max-width 屬性可以解決該問題，如使用 Firebug 所證明的那樣。

要防止Bootstrap CSS 幹擾Google 地圖圖片，您可以實作以下解決方案：

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

透過覆蓋地圖容器內圖片的Bootstrap CSS（由#mapCanvas 識別），您可以恢復標記影像的正常外觀。此解決方案可確保 Bootstrap 樣式不會影響 Google 地圖影像，讓 Bootstrap 和 Google 地圖都能如預期運作。

以上是您的 Google 地圖圖片是否被 Twitter Bootstrap 扭曲了？這是解決問題的方法。的詳細內容。更多資訊請關注PHP中文網其他相關文章！