Bagaimana untuk menggunakan margin dalam css

Atribut jidar dalam CSS digunakan untuk menetapkan kawasan kosong di sekeliling elemen Nilai yang berbeza boleh ditetapkan untuk empat sisi elemen, yang dipanggil jidar atas, jidar kanan, jidar bawah dan jidar kiri.

Penggunaan margin dalam CSS

Sifat margin digunakan dalam CSS untuk menetapkan ruang putih di sekeliling elemen dalam piksel (px), peratusan (%) atau unit panjang lain. margin boleh menetapkan nilai yang berbeza untuk empat sisi elemen, dipanggil margin atas, margin kanan, margin bawah dan margin kiri.

Penggunaan

Sintaks atribut margin ialah:

<code>margin: top-margin right-margin bottom-margin left-margin;</code>

Antaranya, jidar atas, jidar kanan, jidar bawah dan jidar kiri mewakili nilai jidar atas, jidar kanan, bawah margin dan margin kiri masing-masing. Jika anda menetapkan hanya satu nilai, nilai itu akan digunakan pada keempat-empat margin. Contohnya:

<code>margin: 10px;</code>

akan menetapkan 10 piksel ruang putih untuk semua jidar elemen.

Effect

atribut margin mempengaruhi kedudukan elemen pada halaman. Dengan menetapkan jidar dengan sewajarnya, anda boleh mengawal jarak, penjajaran dan reka letak elemen. Sebagai contoh, kod CSS berikut akan menetapkan jidar atas 20 piksel, jidar kanan 10 piksel dan jidar bawah 30 piksel untuk elemen perenggan:

<code>p {
  margin: 20px 10px 30px;
}</code>

Ini akan menghasilkan 20 piksel jidar antara elemen perenggan dan elemen sebelumnya Ruang putih, 10 piksel ruang dari tepi kanan dan 30 piksel ruang dari elemen seterusnya.

Nota

Apabila menggunakan atribut margin, anda perlu memberi perhatian kepada perkara berikut:

• Atribut margin akan meningkatkan saiz keseluruhan elemen. Oleh itu, apabila menetapkan margin, anda harus mempertimbangkan saiz elemen dan susun atur halaman. Harta
• margin tidak mewujudkan sempadan. Jika anda perlu membuat sempadan, anda harus menggunakan harta sempadan.
• Atribut margin boleh digunakan bersama dengan atribut padding untuk mengawal ruang putih di dalam dan di luar elemen.

Atas ialah kandungan terperinci Bagaimana untuk menggunakan margin dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!