Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk melaraskan jarak antara tag dalam css

Bagaimana untuk melaraskan jarak antara tag dalam css

WBOY
WBOYasal
2021-11-15 16:21:149121semak imbas

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.

Bagaimana untuk melaraskan jarak antara tag dalam css

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:

Bagaimana untuk melaraskan jarak antara tag dalam css

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!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn