Posting ini menjelaskan:
- Kapan Memanfaatkan 'padding' vs 'margin' di CSS?
- Bagaimana Cara Memanfaatkan 'margin' di CSS?
- Bagaimana Cara Memanfaatkan 'padding' di CSS?
Kapan Memanfaatkan 'padding' vs 'margin' di CSS?
CSS “ batas ' dan ' lapisan ” properti digunakan untuk mendesain antarmuka. Mereka juga digunakan untuk menentukan celah ekstra atau ruang antar elemen. Namun, kedua properti ini berbeda satu sama lain dalam hal fungsionalitas.
Di sini, kami akan menjelaskan beberapa perbedaan antara kedua properti tersebut:
| batas | lapisan |
|---|---|
| margin menyediakan ruang di luar elemen. | padding menyediakan ruang di dalam konten elemen. |
| Kita dapat mengatur margin elemen sebagai “ mobil ” untuk mengatur margin di sekitar elemen secara otomatis. | padding tidak dapat disetel sebagai otomatis. Pengguna harus menentukan nilai untuk mengatur ruang di dalam elemen. |
| Margin tidak memengaruhi gaya elemen. | Saat kami menerapkan warna latar belakang ke elemen, itu akan memengaruhi gaya elemen. |
| Kita dapat menetapkan nilai positif dan negatif sebagai margin. | padding hanya mendukung nilai positif. |
Bagaimana Cara Memanfaatkan 'margin' di CSS?
Untuk memanfaatkan “ batas ”, pertama, buat properti “ Hasil dari kode yang disebutkan di atas disebutkan di bawah ini: Sekarang, buat lagi “ Keluaran Sekarang, terapkan properti “margin” pada kelas “.margin-div”: Pada kode di atas, “ .margin-div ” digunakan untuk mengakses elemen div untuk menerapkan properti yang tercantum di bawah ini: Di sini, Anda dapat melihat kami telah berhasil mengatur “ batas ” properti pada yang kedua “ div ” elemen: Untuk menggunakan properti “padding”, contoh yang disebutkan di atas telah digunakan. Yang kedua “ div 'wadah, gunakan kelas' padding-div ” untuk menerapkan padding: Keluaran Untuk menerapkan padding dan properti CSS lainnya di “ .padding-div ” kelas, lihat kode yang disediakan: Dalam kode yang disebutkan di atas, kami mengakses “ div ' elemen menggunakan kelas ' .padding-div ”. Kami telah mengatur 'warna latar belakang' dan 'ukuran font'. Selain itu, “ lapisan ” properti digunakan untuk menambah ruang di sekitar konten elemen dari setiap sisi sebagai “ 50px ”. Keluaran Kami telah menjelaskan perbedaan dan penggunaan “padding” dan “margin” di CSS. CSS “ batas ” digunakan untuk mengatur spasi di sekitar elemen, sedangkan “ lapisan ” digunakan untuk menambahkan spasi di sekitar konten elemen. Untuk menerapkan properti margin atau padding, pertama, buat “ div ” wadah, dan tentukan kelasnya. Setelah itu, akses kelas dengan nama kelas dan terapkan “ batas ' dan ' lapisan ” properti. Posting ini telah menjelaskan penggunaan margin vs padding di CSS.
< div kelas = 'linux' >
< p > Linuxhint adalah salah satu situs web tutorial terbaik < / p >
< / div >
< div kelas = 'margin-div' gaya = 'batas:1px hitam pekat' >
< p >Linuxhint adalah salah satu situs tutorial terbaik.< br >
< / p >
< div >
Latar Belakang- warna : rgb ( 199 , 238 , 205 ) ;
font- ukuran : medium;
berbatasan : 3px rgb ( 114 , 250 , 114 ) ;
margin: 100px 100px 100px 100px;
}
Bagaimana Cara Memanfaatkan 'padding' di CSS?
< p > Linuxhint adalah salah satu situs web tutorial terbaik < / p >
< / div >
< div kelas = 'padding-div' gaya = 'batas:1px hitam pekat' >
< p >Linuxhint adalah salah satu situs tutorial terbaik.< br >
< / p >
< / div >
Latar Belakang- warna : rgb ( 199 , 238 , 205 ) ;
font- ukuran : medium;
padding: 50px 50px 50px 50px;
}
Kesimpulan