DAFTAR LABEL POPULER PENELITIAN.ID

Jangan Buka Artikel Ini!

Mengatur Lebar Kolom HTML Menggunakan columnRuleWidth Style DOM

Properti Style columnRuleWidth DOM pada HTML digunakan untuk mendefinisikan atau menentukan nilai lebar dari rule diantara elemen pada dokumen html.

6 Value Properti columnRuleWidth Style DOM pada HTML
Ilustrasi columnRuleWidth Style DOM

Sintak:
  • berfungsi untuk mengembalikan nilai properti columnRuleWidth: object.style.columnRuleWidth
  • berfungsi untuk menenentukan nilai properti columnRuleWidth: object.style.columnRuleWidth = "medium|thin|thick|length|initial|inherit"

Property Values:
  • thin: digunakan untuk menciptakan sebuah rule thin diantara kolom.
  • medium: digunakan untuk menciptakan sebuah nilai lebar rule medium diantara kolom, dan merupakan nilai default dari properti columnRuleWidth.
  • thick: digunakan untuk menciptakan sebuah nilai lebar rule thick diantara kolom.
  • length: digunakan untuk mengatur nilai lebar berdasarkan ukuran length dan tidak menerima nilai negatif.
  • initial: digunakan untuk mengatur properti columnRuleWidth ke nilai default.
  • inherit: digunakan untuk menerima nilai turunan dari elemen parent.

Return Value: berfungsi untuk mengembalikan sebuang string yang merepresentasikan nilai properti columnRuleWidth dari suatu elemen.

Baca Juga:

Contoh: digunakan untuk mendeskripsikan nilai length dari properti.

<!DOCTYPE html>

<html>

 

<head>

 

<title>

Properti Style columnRuleWidth 

DOM

</title>

 

<style>

#MKN1 

{

/* Untuk Chrome dan Safari 

tipe lama */

-webkit-column-count:4;

-webkit-column-rule: 1px green solid;

 

/* Untuk browser Firefox */

-moz-column-count:4;

-moz-column-rule: 1px green solid;

-webkit-column-count:4;

-webkit-column-rule: 1px green solid;

text-align:justify;

}

</style>

 

</head>

 

<body>

 

<div id = "MKN1">

Blog TIK merupakan portal ilmu 

komputer yang digunakan untuk 

mempelajari berbagai materi 

tentang pemrograman dan materi 

TIK lainnya yang sedang 

populer saat ini.

</div>

 

<p>

Klik tombol untuk mengubah 

ukuran lebar column-rule

</p>

 

<button 

onclick = "myBons1s()">

Click Here!

</button>

 

<script>

function myBons1s() 

{

document.getElementById("MKN1").style.columnRuleWidth

= "10px";

}

</script>

 

</body>

 

</html>

Output:
Blog TIK merupakan portal ilmu komputer yang digunakan untuk mempelajari berbagai materi tentang pemrograman dan materi TIK lainnya yang sedang populer saat ini.

Klik tombol untuk mengubah ukuran lebar column-rule



Contoh: digunakan untuk mendeskripsikan nilai properti medium.

<!DOCTYPE html>

<html>

 

<head>

 

<title>

Properti Style columnRuleWidth 

DOM

</title>

 

<style>

#MKN2 

{

/* Untuk browser Chrome dan 

Safari tipe lama */

-webkit-column-count:4;

-webkit-column-rule: 1px green solid;

 

/* Untuk browser Firefox */

-moz-column-count:4;

-moz-column-rule: 1px green solid;

-webkit-column-count:4;

-webkit-column-rule: 1px green solid;

text-align:justify;

}

</style>

 

</head>

 

<body>

 

<div id = "MKN2">

Blog TIK merupakan portal ilmu 

komputer yang digunakan untuk 

mempelajari berbagai materi 

pemrograman dan materi TIK 

lainnya yang sedang populer 

saat ini.

</div>

 

<p>

Klik tombol untuk mengubah 

ukuran lebar width

</p>

 

<button 

onclick = "myBons2s()">

Click Here!

</button>

 

<script>

function myBons2s() 

{

document.getElementById("MKN2").style.columnRuleWidth

= "medium";

}

</script>

 

</body>

 

</html>

Output:
Blog TIK merupakan portal ilmu komputer yang digunakan untuk mempelajari berbagai materi pemrograman dan materi TIK lainnya yang sedang populer saat ini.

Klik tombol untuk mengubah ukuran lebar width


Komentar

  1. Jenis browser apa saja yang dapat digunakan untuk mengaktifkan properti columnRuleWidth Style DOM pada HTML?

    BalasHapus
    Balasan
    1. Berikut adalah beberapa jenis browser yang dapat digunakan untuk mengaktifkan properti columnRuleWidth Style DOM pada HTML:
      1. Google Chrome
      2. Firefox menggunakan MozColumnRuleWidth
      3. Internet Explorer
      4. Opera
      5. Apple Safari

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

    BalasHapus
    Balasan
    1. Properti columnRuleWidth Style DOM pada HTML merupakan properti yang digunakan untuk mengatur ukuran lebar rule antar kolom pada dokumen HTML. Nilai default dari properti columnRuleWidth adalah medium.

      Hapus
    2. Properti columnRuleWidth Style DOM pada HTML merupakan properti yang digunakan untuk menentukan lebar aturan antar kolom.

      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