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
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!