Bagaimana untuk Menghapuskan Isu Ruang Putih dan Tatal dengan Kanvas dalam Bekas Div?

Menyelesaikan Ruang Putih dan Penatalan Berlebihan dalam Kanvas

Apabila membenamkan elemen kanvas dalam bekas div, isu penggayaan tertentu mungkin timbul. Satu isu biasa ialah kehadiran ruang putih di bahagian bawah kanvas dan penatalan yang berlebihan.

Punca:
Secara lalai, kanvas dipaparkan sebagai elemen sebaris. Ini boleh mengakibatkan masalah ruang putih dan penjajaran menegak yang tidak diingini apabila diletakkan dalam bekas div peringkat blok.

Penyelesaian:

1. Buat Kanvas Elemen Blok:
   Ubah CSS elemen kanvas untuk memaparkannya sebagai blok elemen:

   canvas {
     display: block;
   }

2. Penjajaran Menegak:
   Sebagai alternatif, gunakan penjajaran menegak CSS untuk meletakkan kanvas dengan betul dalam bekas:

   canvas {
     vertical-align: top;
   }

Pelaksanaan:

Ubah suai kod yang disediakan seperti berikut:

.screen CSS :

.screen {
  background: red;
  height: 100px;
  width: 300px;
  overflow: auto;
  border-radius: 20px;
}
canvas {
  display: block;
}

::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}

Penyesuaian ini memastikan bahawa kanvas berfungsi sebagai elemen blok, menghapuskan ruang putih dan isu menatal yang berlebihan.

Atas ialah kandungan terperinci Bagaimana untuk Menghapuskan Isu Ruang Putih dan Tatal dengan Kanvas dalam Bekas Div?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!