Mengatur Lapisan Bawah HTML Menggunakan paddingBottom Style DOM
Sebelum memahami lebih dalam materi tentang Mengatur Lapisan Bawah HTML Menggunakan paddingBottom Style DOM, terlebih dahulu pelajari materi tentang: Mengatur Nilai Lapisan HTML Menggunakan Padding Style DOM [klik], Properti overflowY Style HTML DOM dan Fungsinya [klik], dan Properti overflowX Style HTML DOM dan Fungsinya [klik].
Sintak:
- untuk mendapatkan nilai properti: object.style.paddingBottom
- untuk mengatur nilai properti: object.style.paddingBottom = "%|length|initial|inherit"
Return Values: berfungsi untuk mengembalikan sebuah string, yang merepresentasikan padding bottom dari suatu elemen.
- %: digunakan untuk mendefinisikan padding bottom dalam satuan persen dari lebar elemen parent.
- length: digunakan untuk mendefinisikan padding bottom dalam satuan unit length.
- initial: digunakan untuk mengatur nilai properti menjadi nilai default-nya.
- inherit: digunakan untuk menerima nilai turunan properti dari elemen parent.
Berikut adalah ilustrasi program properti paddingBottom Style.
Contoh: pengaturan padding bottom dari elemen DIV.
<!DOCTYPE html>
<html>
<head>
<title>
Properti Style paddingBottom
pada HTML
</title>
<style>
#MyElement
{
border: 1px solid black;
background-color: green;
width: 300px;
height: 300px;
}
h1
{
color: green;
}
h2
{
font-family: Impact;
}
body
{
text-align: center;
}
</style>
</head>
<body>
<h1>
Blog Elfan
</h1>
<h2>
Properti Style paddingBottom
</h2>
<p>
Untuk mengatur padding bottom,
double klik pada tombol "Apply
Bottom Padding":
</p>
<br>
<button
ondblclick="padding()">
Apply Bottom Padding
</button>
<div id="MyElement">
Selamat datang di indomaret.
</div>
<script>
function padding()
{
document.getElementById("MyElement")
.style.paddingBottom = "100px";
}
</script>
</body>
</html>
Output:Blog Elfan
Properti Style paddingBottom
Untuk mengatur padding bottom, double klik pada tombol "Apply Bottom Padding":
- 8 Value Properti pageBreakBefore Style DOM pada HTML [klik]
- 4 Value Properti pageBreakInside Style DOM pada HTML [klik]
- 4 Value Properti Perspective Style DOM pada HTML [klik]
- 3+ Value Properti perspectiveOrigin Style DOM pada HTML [klik]
- 7 Value Properti Position Style DOM pada HTML [klik]
- 11 Karakter Tanda Kutip Style DOM pada HTML [klik]
- 6 Value Properti Resize Style DOM pada HTML [klik]
5 komentar untuk "Mengatur Lapisan Bawah HTML Menggunakan paddingBottom Style DOM"
Hubungi admin melalui Wa : +62-896-2414-6106
Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung.
Bantu admin meningkatkan kualitas blog dengan melaporkan berbagai permasalahan seperti typo, link bermasalah, dan lain sebagainya melalui kolom komentar.
- Ikatlah Ilmu dengan Memostingkannya -
- Big things start from small things -
Jenis browser-browser apa saja yang dapat digunakan oleh pembuat web untuk mengaktifkan properti paddingBottom Style DOM pada HTML?
BalasHapusBerikut ini beberapa jenis browser yang biasa digunakan untuk mengaktifkan properti paddingBottom Style DOM pada HTML:
Hapus1. Google Chrome
2. Internet Explorer
3. Firefox
4. Opera
5. Apple Safari
Apa yang dimaksud dengan properti paddingBottom Style DOM pada HTML?
BalasHapusProperti paddingBottom Style DOM pada HTML merupakan properti yang digunakan untuk mengatur atau mengembalikan nilai padding bottom dari suatu elemen.
HapusProperti paddingBottom merupakan properti yang digunakan untuk mengatur atau mengembalikan nilai padding bottom dari suatu elemen, baik itu berupa properti margin ataupun properti padding yang disisipkan pada ruang sekitar elemen.
Hapus