Mengapa Bekas Peta Google Saya Tidak Dipaparkan pada 100% Lebar dan Tinggi?

Cara Menetapkan Lebar dan Tinggi DIV Bekas Peta Google kepada 100%

Setelah memuatkan API Peta Google v3 dan cuba memaparkannya dalam div, anda mungkin menghadapi situasi di mana peta tidak kelihatan walaupun menetapkan kedua-dua lebar dan tinggi kepada 100%. Kod HTML yang anda berikan adalah seperti berikut:

<code class="html"><!-- Maps Container -->
<div id="map_canvas" style="height:100%;width:100px;margin:0 auto;">...</div></code>

Untuk menyelesaikan isu ini, adalah penting untuk memastikan bahawa semua bekas induk bagi div kontena Peta Google mempunyai lebarnya ditetapkan kepada 100%. Selain itu, div #content, yang mengandungi bekas Peta Google, mesti mempunyai lebar dan ketinggian yang ditetapkan secara eksplisit kepada nilai mutlak.

Berikut ialah coretan kod CSS dikemas kini yang menangani isu ini:

<code class="css">body, html {
  height: 100%;
  width: 100%;
}

div#content {
  width: 100%; /* Set absolute width here */
  height: 100%; /* Set absolute height here */
}</code>

Dengan membuat perubahan ini, anda akan dapat menetapkan lebar dan tinggi bekas Peta Google DIV kepada 100% dan menjadikannya meliputi seluruh halaman seperti yang dimaksudkan.

Atas ialah kandungan terperinci Mengapa Bekas Peta Google Saya Tidak Dipaparkan pada 100% Lebar dan Tinggi?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!