Dalam HTML5, atribut margin digunakan untuk menetapkan margin elemen ini boleh ditetapkan kepada 1 hingga 4 nilai, yang digunakan untuk menetapkan nilai bagi empat margin masing-masing ialah "
Persekitaran pengendalian tutorial ini: sistem Windows 10, versi HTML5, komputer Dell G3.
Atribut margin menetapkan margin luar elemen.
Atribut ini boleh mengambil 1 hingga 4 nilai:
Jika anda menentukan nilai, seperti div {margin: 50px} - semua margin ialah 50 px
Jika Nyatakan dua nilai, seperti div {margin: 50px 10px} - jidar atas dan bawah ialah 50px, dan jidar kiri dan kanan ialah 10 px.
Jika tiga nilai ditentukan, seperti div {margin: 50px 10px 20px}- margin atas ialah 50 px, jidar kiri dan kanan ialah 10 px, dan jidar bawah ialah 20 px.
Jika empat nilai ditentukan, seperti div {margin: 50px 10px 20px 30px} - jidar atas ialah 50 px, jidar kanan ialah 10 px, jidar bawah ialah 20 px dan kiri margin ialah 30 px .
Sintaks:
Object.style.margin=margin
Peratus (berdasarkan jumlah ketinggian atau lebar objek induk)
Nilai panjang (mentakrifkan jidar tetap)
auto (nilai yang ditetapkan oleh penyemak imbas).
Contohnya adalah seperti berikut:
<html>
<head>
<script type="text/javascript">
function changeMargin()
{
document.getElementById("p1").style.margin="100px";
}
</script>
</head>
<body>
<input type="button" onclick="changeMargin()" value="Change margins of a paragraph" />
<p id="p1">This is a paragraph</p>
</body>
</html>Hasil keluaran:
Tutorial yang disyorkan: "tutorial video html"
Atas ialah kandungan terperinci Cara menggunakan atribut margin dalam html5. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Apakah kaedah penghasilan penghasilan animasi html5?
Perbezaan antara HTML dan HTML5
Bagaimana untuk menyahpasang phpnow
Sejarah operasi jadual paparan Oracle
apa yang python boleh buat
Penggunaan anotasi halaju
Tidak dapat memulakan komputer anda dengan betul
Bagaimana untuk mematikan komputer anda dengan cepat
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
