Mengatur Lebar Maksimal HTML Menggunakan maxWidth Style DOM
Sebelum memahami lebih dalam materi tentang Mengatur Lebar Maksimal HTML Menggunakan maxWidth Style DOM, terlebih dahulu pelajari materi tentang: Mengatur Panjang Maksimal HTML Menggunakan maxHeight Style DOM, Mengatur Batas Atas HTML Menggunakan marginTop Style DOM, dan Mengatur Margin Kanan HTML Menggunakan marginRight Style DOM.
- digunakan untuk mengembalikan nilai properti maxWidth: object.style.maxWidth
- digunakan untuk mengatur nilai properti maxWidth: object.style.maxWidth = "none|length|%|initial|inherit"
Property Values:
- none: merupakan nilai default yang tidak disertai nilai batasan apapun pada ukuran lebar dari suatu elemen.
- length: digunakan untuk mendefinisikan nilai lebar maksimum dalam unit length.
- %: digunakan untuk mendefinisikan nilai lebar maksimum dalam satu persen elemen parent.
- initial: digunakan untuk mengatur nilai properti ke nilai default-nya.
- inherit: digunakan untuk menerima nilai turunan dari elemen parent.
Return Values: berfungsi untuk mengembalikan nilai lebar maksimum dari suatu elemen.
<!DOCTYPE html>
<html>
<head>
<title>
Properti Style maxWidth DOM
</title>
</head>
<style>
#Bon1
{
color: white;
width: 300px;
background: green;
}
</style>
<body>
<center>
<h1
id="Bon1">
Blog Elfan
</h1>
<h2>
Properti Style maxWidth DOM
</h2>
<br>
<button
type="button"
onclick="myBons()">
Click to change
</button>
<script>
function myBons()
{
// mengatur nilai lebar
// menggunakan unit length.
document.getElementById(
"Bon1").style.maxWidth = "220px";
}
</script>
</center>
</body>
</html>
Blog Elfan
Properti Style maxWidth DOM
Contoh: mengatur nilai lebar dalam satuan '%'.
<!DOCTYPE html>
<html>
<head>
<title>
Properti Style maxWidth DOM
</title>
</head>
<style>
#Don1
{
color: white;
width: 50%;
background: green;
}
#Don_Center
{
background: yellow;
width: 400px;
margin-left: 150px;
}
</style>
<body>
<center
id="Don_Center">
<h3
id="Don1">
Blog Elfan
</h3>
<h2>
Properti Style maxWidth DOM
</h2>
<br>
<button
type="button"
onclick="myDons()">
Click to change
</button>
<script>
function myDons()
{
// Mengatur nilai lebar
// menggunakan %.
document.getElementById(
"Don1").style.maxWidth = "35%";
}
</script>
</center>
</body>
</html>
Blog Elfan
Properti Style maxWidth DOM
- 3 Value Properti Opacity Style DOM pada HTML
- 3 Value Properti Order Style DOM pada HTML
- 3 Value Properti Orphans Style DOM pada HTML
- 5 Value Properti Outline Style DOM pada HTML
- 3 Value Properti outlineColor Style DOM pada HTML
- 3 Value Properti outlineOffset Style DOM pada HTML
- 12 Value Properti outlineStyle DOM pada HTML
6 komentar untuk "Mengatur Lebar Maksimal HTML Menggunakan maxWidth 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 apa saja yang biasa digunakan oleh seorang pengembang untuk mengaktifkan properti maxWidth Style DOM pada HTML?
BalasHapusBerikut adalah beberapa jenis browser yang dapat digunakan untuk mengaktifkan properti maxWidth Style DOM pada HTML:
Hapus1. Google Chrome
2. Internet Explorer
3. Mozilla firefox
4. Opera
5. Safari
Apa yang dimaksud dengan properti maxWidth Style DOM pada HTML?
BalasHapusProperti maxWidth Style DOM pada HTML merupakan properti yang digunakan untuk menetapkan atau mengembalikan nilai lebar maksimum dari suatu elemen.
HapusProperti maxWidth Style DOM pada HTML merupakan properti yang hanya berpengaruh pada elemen level blok atau elemen dengan posisi absolut atau tetap.
HapusLebar nilai dari elemen tidak boleh lebih besar daripada nilai yang telah ditentukan oleh properti maxWidth.
Hapus