Belajar Html: Belajar Mengenai Padding Dan Margin
Padding Dan Margin Adalah Sesuatu Yang Dapat Memberikan Jarak Pada Konten Dari Suatu Halaman Website. Kedua Hal Ini Biasanya Di Gunakan Ketika Kita Mengaput Sebuah Posisi Konten Pada Html.
Padding
Padding merupakan jarak antara area konten serta border. Padding banyak diterapkan di elemen Bila elemen tadi menerapkan warna latar atau pun border. Padding memberikan sedikit ruang sehingga konten pada dalam elemen bisa lebih nyaman buat ditampilkan. Kita Dapat Menetukan Nilai Padding Seperti Contoh Seperti Berikut:
padding-top: 10px;
padding-right: 15px;
padding-bottom: 10px;
padding-left: 15px;
Atau Contoh Penulisan Code Padding Pada Pengaturan Konten Html Adalah Sebagai Berikut:
<html lang="en">
<head>
<style>
p {
border: 4px solid #00a2c6;
width: 275px;
}
p.example {
padding: 10px;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aspernatur beatae commodi dignissimos eaque fugiat inventore maiores neque nisi sint. A dolore eaque fuga, iste minus porro provident sit tempore ullam.</p>
<p class="example">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet assumenda blanditiis cum dignissimos enim esse excepturi illum inventore maiores minima, nemo nisi obcaecati officia pariatur qui quibusdam sed. Ab, dolorum?</p>
</body>
</html>
Atau Jika Di Tampilkan Dalam Browser Akan Tampil Seperti Berikut:
Seperti yang kita lihat, paragraf kedua jauh lebih nyaman dibaca sebab terdapat jarak antara teks serta border dari kotak. Kotak pun menjadi sedikit lebar karena adanya padding.
Margin
Margin merupakan ruang atau jarak pada sebuah elemen. tetapi jarak tersebut terletak pada luar dari konten dan border elemen. Margin dipergunakan buat menjaga elemen supaya tidak bertabrakan satu sama lain atau dari tepi jendela browser.
margin-top: 10px;
margin-right: 15px;
margin-bottom: 20px;
margin-left: 25px;
Jadi, Padding Dan Margin Memiliki Peran Yang Sangat Penting Dalam Mengatur Posisi Letak Dari Sebuah Konten Dalam Suatu Halaman Website. Padding Dan Margin Memiliki Kesamaan Yaitu Mengatur Jarak. Namun, Tetap Saja Kedua Hal Ini Berbeda.
Ini
Adalah Materi Dasar Dalam Bahasa Markup Html Yaitu Belajar Mengenal Padding Dan Margin Untuk Mengatur Posisi Sebuah Konten Dalam Sebuah Halaman Website. Tentu, Sangat Mudah Di Pelajari
Untuk Pemula. Masih Banyak Yang Akan Kita Pelajari Mengenai Bahasa Markup Html ini.