Rumah > Artikel > hujung hadapan web > Bagaimana untuk melaraskan jarak antara tag dalam css
Kaedah pelarasan: 1. Tambahkan "margin: jidar atas, jidar kanan, jidar bawah, jidar kiri;" pada teg a; -top" pada teg :Jing atas;", "margin-kanan: jidar kanan;" dan gaya lain menetapkan jidar dalam arah yang berbeza.
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.
Cara melaraskan jarak antara tag dalam css
1. CSS boleh menggunakan atribut margin untuk menetapkan jarak antara tag, dan atribut margin boleh ditetapkan Untuk margin tag a, anda juga boleh menggunakan atribut margin-left untuk menetapkan margin berasingan.
harta trengkas margin menetapkan semua sifat margin dalam satu pengisytiharan. Harta ini boleh mempunyai 1 hingga 4 nilai.
Sifat trengkas ini menetapkan lebar semua jidar elemen atau menetapkan lebar jidar pada setiap sisi.
Jing bersebelahan menegak bagi elemen peringkat blok akan digabungkan, manakala unsur sebaris sebenarnya tidak akan menduduki jidar atas dan bawah. Jidar kiri dan kanan unsur sebaris tidak digabungkan. Begitu juga, margin unsur terapung tidak digabungkan. Ia dibenarkan untuk menentukan nilai margin negatif, tetapi berhati-hati apabila menggunakannya.
Contoh:
margin:10px 5px 15px 20px;
bermaksud: jidar atas ialah 10px, jidar kanan ialah 5px, jidar bawah ialah 15px dan jidar kiri ialah 20px.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> a{ margin:0px 0px 0px 202px; } </style> <head> <body> <a href="#">a标签1</a><a href="#">a标签2</a> </body> </html>
2. Terdapat satu lagi cara ungkapan, "margin-left: left margin value;" Kod sampel adalah seperti berikut:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> a{ margin-left:202px; } </style> <head> <body> <a href="#">a标签1</a><a href="#">a标签2</a> </body> </html>
Hasil keluaran:
Dalam contoh di atas, gaya "margin-left: left margin value;" ditambahkan pada elemen label.
Untuk lebih banyak pengetahuan berkaitan pengaturcaraan, sila lawati: Video Pengaturcaraan! !
Atas ialah kandungan terperinci Bagaimana untuk melaraskan jarak antara tag dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!