Rumah >hujung hadapan web >tutorial css >Berikut ialah beberapa pilihan tajuk, bertujuan untuk format soalan dan mencerminkan kandungan: * Imej Peta Google Diherotkan oleh Bootstrap: Bagaimana untuk Membetulkan Isu Lebar Maks? * Mengapa Peta Google Images Ske

Berikut ialah beberapa pilihan tajuk, bertujuan untuk format soalan dan mencerminkan kandungan: * Imej Peta Google Diherotkan oleh Bootstrap: Bagaimana untuk Membetulkan Isu Lebar Maks? * Mengapa Peta Google Images Ske

Barbara Streisand
Barbara Streisandasal
2024-10-27 22:58:02823semak imbas

Here are a few title options, aiming for a question format and reflecting the content:

* Google Maps Images Distorted by Bootstrap: How to Fix the Max-Width Issue?
* Why are my Google Maps Images Skewed with Twitter Bootstrap?
* Twitter Bootstrap vs. Goo

Penyelewengan Peta Google Disebabkan oleh CSS Bootstrap Twitter

Apabila menggunakan Twitter Bootstrap dan Peta Google secara serentak, imej dalam peta, seperti penanda, mungkin menjadi herot. Isu ini timbul disebabkan penggayaan CSS yang terdapat dalam Bootstrap.

Peraturan CSS khusus yang bertanggungjawab untuk herotan ini ialah sifat lebar maksimum, yang digunakan pada semua imej dengan cara berikut:

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

Apabila sifat ini digunakan untuk memetakan imej, ia mengehadkan lebar maksimumnya kepada ruang yang tersedia pada halaman. Akibatnya, imej menjadi senget.

Untuk menyelesaikan isu ini, kami boleh secara selektif mengatasi sifat lebar maksimum untuk imej Peta Google. Dalam Bootstrap 2.0, kod CSS berikut boleh digunakan:

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

Dengan menggunakan penggantian ini pada elemen kanvas peta (#mapCanvas), kami memastikan bahawa sifat lebar maksimum tidak menjejaskan imej dalam Peta Google. Ini membolehkan imej dipaparkan dengan betul tanpa sebarang herotan.

Atas ialah kandungan terperinci Berikut ialah beberapa pilihan tajuk, bertujuan untuk format soalan dan mencerminkan kandungan: * Imej Peta Google Diherotkan oleh Bootstrap: Bagaimana untuk Membetulkan Isu Lebar Maks? * Mengapa Peta Google Images Ske. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn