Lompat ke konten Lompat ke sidebar Lompat ke footer

Mengatur Panjang Minimal HTML Menggunakan minHeight Style DOM

Properti minHeight Style DOM pada HTML digunakan untuk mengatur atau mengembalikan nilai height minimum dari suatu elemen. Properti ini berdampak hanya pada elemen block-level, elemen absolute, atau elemen posisi yang bersesuaian.

Sebelum memahami lebih dalam materi tentang Mengatur Panjang Minimal HTML Menggunakan minHeight Style DOM, terlebih dahulu pelajari materi tentang: Mengatur Lebar Maksimal HTML Menggunakan maxWidth Style DOM, Mengatur Panjang Maksimal HTML Menggunakan maxHeight Style DOM, dan Mengatur Batas Atas HTML Menggunakan marginTop Style DOM.

Sintak:
  • digunakan untuk mengembalikan nilai properti minHeight: object.style.minHeight
  • digunakan untuk mengatur nilai properti minHeight: object.style.minHeight = "length|%|initial|inherit"

Property Values:
  • length: mendefinisikan nilai length dalam unit length.
  • %: mendefinisikan nilai length dalam satuan persen yang dibandingkan dengan elemen parent.
  • initial: digunakan untuk mengatur nilai initial yang merupakan nilai default dari properti.
  • inherit: meneriman nilai turunan properti dari elemen parent.

Return Values: digunakan untuk mengembalikan nilai minimum height dari suatu elemen.

Baca Juga:

Contoh:

<!DOCTYPE html>

<html>

 

<head>

 

<title>

Properti Style minHeight DOM

</title>

 

<style>

#Bon1 

{

color: white;

width: 50%;

background: green;

}

</style>

 

</head>

 

<body>

<center>

 

<h1 

id="Bon1">

Blog Elfan

</h1>

 

<h2>

Properti Style minHeight DOM

</h2>

 

<br>

 

<button 

type="button" 

onclick="Bons()">

Click to change

</button>

 

<script>

function Bons() 

{

document.getElementById("Bon1").style.minHeight

= "150px";

}

</script>

 

</center>

</body>

 

</html>

Output:

Blog Elfan

Properti Style minHeight DOM




Contoh:

<!DOCTYPE html>

<html>

 

<head>

 

<title>

Properti Style minHeight DOM

</title>

 

<style>

#Gon1 

{

color: white;

width: 50%;

background: green;

}

 

#Gon_Center 

{

background: yellow;

height: 200px;

}

</style>

 

</head>

 

<body>

<center id="Gon_Center">

 

<h1 

id="Gon1">

Blog Elfan

</h1>

 

<h2>

Properti Style minHeight DOM

</h2>

 

<br>

 

<button 

type = "button" 

onclick = "Gons()">

Click to change

</button>

 

<script>

function Gons() 

{

document.getElementById("Gon1").style.minHeight

= "50%";

}

</script>

 

</center>

</body>

 

</html>

Output:

Blog Elfan

Properti Style minHeight DOM



Artikel ini didedikasikan kepada: Brian Inderajati, Camelia Zara Arthamevea, Chisbiya Umi Latifa, Daffa Agnis Putra, dan Dahlia Kusuma Ramadhani Dewi Suryani.

5 komentar untuk "Mengatur Panjang Minimal HTML Menggunakan minHeight Style DOM"

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

    BalasHapus
    Balasan
    1. Berikut ini adalah beberapa jenis browser yang dapat digunakan oleh seorang pengembang untuk mengaktifkan properti minHeight Style DOM pada HTML:
      1. Google Chrome
      2. Internet Explorer
      3. Mozilla Firefox
      4. Opera
      5. Safari

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

    BalasHapus
    Balasan
    1. Properti minHeight Style DOM pada HTML merupakan properti yang digunakan untuk menetapkan atau mengembalikan nilai tinggi minimum dari suatu elemen.

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

      Hapus

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 -