DAFTAR LABEL POPULER PENELITIAN.ID

Jangan Buka Artikel Ini!

Mengatur Lebar Maksimal HTML Menggunakan maxWidth Style DOM

Properti maxWidth Style DOM pada HTML digunakan untuk mengatur atau mengembalikan nilai lebar maksimum dari suatu elemen. Properti maxWidth hanya berdampak pada elemen block-level, elemen absolute, atau elemen posisi yang bersesuaian.

Sintak:
  • 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.

Baca Juga:


5 Value Properti maxWidth Style DOM pada HTML
Properti maxWidth Style DOM

Contoh: mengatur nilai lebar dalam unit length.

<!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>

Output:

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>

Output:

Blog Elfan

Properti Style maxWidth DOM



Komentar

  1. Jenis browser apa saja yang biasa digunakan oleh seorang pengembang untuk mengaktifkan properti maxWidth Style DOM pada HTML?

    BalasHapus
    Balasan
    1. Berikut adalah beberapa jenis browser yang dapat digunakan untuk mengaktifkan properti maxWidth Style DOM pada HTML:
      1. Google Chrome
      2. Internet Explorer
      3. Mozilla firefox
      4. Opera
      5. Safari

      Hapus
  2. Apa yang dimaksud dengan properti maxWidth Style DOM pada HTML?

    BalasHapus
    Balasan
    1. Properti maxWidth Style DOM pada HTML merupakan properti yang digunakan untuk menetapkan atau mengembalikan nilai lebar maksimum dari suatu elemen.

      Hapus
    2. Properti maxWidth Style DOM pada HTML merupakan properti yang hanya berpengaruh pada elemen level blok atau elemen dengan posisi absolut atau tetap.

      Hapus
    3. Lebar nilai dari elemen tidak boleh lebih besar daripada nilai yang telah ditentukan oleh properti maxWidth.

      Hapus

Posting Komentar

Hubungi admin melalui Wa : +62-896-2514-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 ~

Postingan populer dari blog ini (30 Hari)

Enkapsulasi Java dan Fungsinya

Specifier %d dan %i Bahasa C dan Fungsinya

4 Kesalahan Umum yang Sering Terjadi pada PTK

7 Paradigma Penelitian pada Statistika Penelitian

Cara Membuat Drag and Drop pada HTML

Postingan populer dari blog ini (All Time)

Enkapsulasi Java dan Fungsinya

Komunitas