Bagaimana untuk Menyelesaikan Isu Keserasian CSS Bootstrap Twitter dengan Peta Google?

Keserasian CSS Bootstrap Twitter dan Peta Google

Menggabungkan perpustakaan CSS Twitter Bootstrap ke dalam projek web boleh meningkatkan penggayaan pelbagai elemen. Walau bagaimanapun, ia boleh memperkenalkan isu keserasian dengan komponen lain, seperti Peta Google.

Satu isu ketara timbul apabila CSS Bootstrap mempengaruhi imej yang dipaparkan dalam Peta Google. Lebar maksimum sifat CSS: 100% menyerong imej penanda dan elemen lain pada peta.

Untuk menyelesaikan isu ini, ganti CSS Bootstrap untuk bekas Peta Google. Untuk Bootstrap 2.0, sifat CSS tersuai berikut boleh digunakan:

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

Peraturan CSS ini menyasarkan elemen imej dalam bekas #mapCanvas, yang biasanya merangkumi komponen Peta Google. Dengan menetapkan lebar maksimum kepada tiada, CSS Bootstrap tidak lagi mengehadkan lebar imej, membenarkan imej tersebut dipaparkan dengan betul.

Dengan melaksanakan penyelesaian ini, anda boleh mengekalkan faedah penggayaan Twitter Bootstrap sambil memastikan Peta Google imej dipaparkan seperti yang dimaksudkan.

Atas ialah kandungan terperinci Bagaimana untuk Menyelesaikan Isu Keserasian CSS Bootstrap Twitter dengan Peta Google?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!