Mengatur Klip Latar Belakang HTML backgroundClip Style DOM
Properti style backgroundClip DOM pada HTML digunakan untuk mengatur atau mengembalikan nilai painting area dari background pada dokumen HTML.
Sintak:
Property Values:
 |
| Ilustrasi backgroundClip HTML |
Sebelum memahami lebih dalam materi tentang Mengatur Klip Latar Belakang HTML backgroundClip Style DOM, terlebih dahulu pelajari materi tentang: Mengatur Perulangan Latar Belakang HTML backgroundRepeat Style DOM [klik], Mengatur Latar Belakang HTML backgroundPosition Style DOM [klik], dan Mengatur Gambar Latar Belakang HTML backgroundImage Style DOM [klik].
- digunakan untuk mengembalikan nilai properti backgroundClip: object.style.backgroundClip
- digunakan untuk mengatur properti backgroundClip: object.style.backgroundClip = "border-box|padding-box|content-box|initial|inherit"
Property Values:
- border-box property: digunakan untuk mengatur nilai background color menyebar keseluruh bagian divisi.
- padding-box property: digunakan untuk mengatur background di dalam border.
- content-box property: digunakan untuk mengatur background color hanya pada bagian konten saja.
Baca Juga:
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Border Box
</title>
<style>
#mnn
{
background-color: green;
background-clip: border-box;
text-align: center;
border: 10px dashed black;
color: white;
}
</style>
</head>
<body>
<center>
<h1>
Properti Style backgroundClip
DOM
</h1>
<div id="mnn">
<h2>
Blog Elfan
</h2>
<p>
background-clip: border-box;
</p>
</div>
<br>
<button
onclick="myBons()">
Submit
</button>
<script>
function myBons()
{
document.getElementById("mnn"
).style.backgroundClip = "padding-box";
}
</script>
</center>
</body>
</html>
Referensi Tambahan:
- 5 Value Properti borderBottom Style DOM pada HTML [klik]
- 4 Value Properti borderBottomColor Style DOM pada HTML [klik]
- 4 Value Properti borderBottomLeftRadius Style DOM pada HTML [klik]
- 4 Value Properti borderBottomRightRadius Style DOM pada HTML [klik]
- 12 Value Properti borderBottomStyle DOM pada HTML [klik]
- 6 Value Properti borderBottomWidth Style DOM pada HTML [klik]
- 4 Value Properti Style borderCollapse DOM pada HTML [klik]
Artikel ini didedikasikan kepada: Enrico Dui Martinez, Erna Melina, Eva Widianingrum, Evina Diva Prasiwi, dan Fahrizal Febrilliantza Abdullah.
Jenis browser apa saja yang dapat digunakan untuk mengaktifkan properti backgroundClip Style DOM pada HTML?
BalasHapusBerikut adalah beberapa jenis browser yang dapat digunakan untuk mengaktifkan properti backgroundClip Style DOM pada HTML:
Hapus1. Google Chrome
2. Internet Explorer
3. Firefox
4. Opera
5. Safari
Apa yang dimaksud dengan properti backgroundClip Style DOM pada HTML?
BalasHapusProperti backgroundClip Style DOM pada HTML digunakan untuk mengatur atau mengembalikan nilai dari area painting background.
HapusProperti backgroundClip Style DOM pada HTML digunakan untuk mendefinisikan seberapa jauh latar belakang, baik latar belakang warna maupun latar belakang gambar, harus diperluas dalam sebuah elemen pada dokumen html.
Hapus