Bagaimanakah Saya Boleh Menghapuskan Ruang Putih yang Tidak Diingini Di Sekitar Elemen Badan HTML Saya?

Menghapuskan Ruang Putih Lalai Di Sekitar Elemen Badan

Apabila bekerja dengan HTML dan CSS, anda mungkin menghadapi ruang putih yang tidak diingini di sekeliling elemen anda. Ruang ini boleh disebabkan oleh gaya CSS lalai yang digunakan pada elemen.

Margin Lalai

Secara lalai, elemen mempunyai margin 8px pada semua sisi. Jidar ini mewujudkan jurang antara kandungan dan tepi tetingkap penyemak imbas. Untuk mengalih keluar jidar ini, tambahkan gaya berikut pada CSS anda:

body {
  margin: 0;
}

Ini akan menetapkan semula jidar badan kepada 0, menghapuskan ruang tambahan.

Tetapan Semula CSS Global

Sebagai alternatif, anda boleh menggunakan tetapan semula CSS global untuk mengalih keluar semua gaya lalai daripada semua elemen HTML. Ini ialah teknik biasa yang digunakan untuk mewujudkan titik permulaan yang konsisten dan boleh diramal untuk menggayakan tapak web anda.

Satu tetapan semula global yang popular ialah lembaran gaya "Normalize" oleh Nicolas Gallagher:

*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

Tetapan semula ini mengalih keluar jidar dan pelapik daripada semua elemen, termasuk elemen.

Tetapan Semula Terpilih

Jika anda hanya perlu menetapkan semula gaya untuk elemen tertentu, anda boleh menggunakan lebih banyak pemilih disasarkan. Sebagai contoh, CSS berikut akan mengalih keluar margin dan padding daripada elemen serta semua anak-anaknya:

body,
body > * {
  margin: 0;
  padding: 0;
}

Kesimpulan

Dengan mengalih keluar jidar lalai daripada elemen atau menggunakan tetapan semula CSS global, anda boleh menghapuskan ruang putih yang tidak perlu dan memastikan kandungan anda sejajar seperti yang diharapkan dalam tetingkap penyemak imbas. Ingat untuk menguji perubahan anda dengan teliti untuk memastikan ia tidak mengganggu kefungsian atau penampilan tapak web anda.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menghapuskan Ruang Putih yang Tidak Diingini Di Sekitar Elemen Badan HTML Saya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!