Lompat ke konten Lompat ke sidebar Lompat ke footer

Mengatur Gaya Garis Luar HTML Menggunakan outlineStyle DOM

Properti Style outlineStyle DOM pada HTML digunakan untuk mengatur atau mengembalikan style dari outline sekitar elemen.

12 Value Properti outlineStyle DOM pada HTML
Properti outlineStyle DOM

Sebelum memahami lebih dalam materi tentang Mengatur Gaya Garis Luar HTML Menggunakan outlineStyle DOM, terlebih dahulu pelajari materi tentang: outlineOffset Style HTML DOM dan Fungsinya [klik], Mengatur Warna Garis Luar HTML Menggunakan outlineColor Style DOM [klik], dan Mengatur Garis Luar HTML Menggunakan Outline Style DOM [klik].

Sintak:
  • digunakan untuk mengembalikan nilai properti outlineStyle: object.style.outlineStyle
  • digunakan untuk mengatur properti outlineStyle: object.style.outlineStyle = value:

Property Values:
  • none: merupakan nilai default yang digunakan untuk mengatur tidak menampilkan outline.
  • hidden: digunakan untuk turned off nilai outline.
  • dotted: digunakan untuk mengatur nilai properti menjadi outline dotted.
  • dashed: digunakan untuk mengatur nilai properti menjadi outline dashed.
  • solid: digunakan untuk mengatur nilai properti menjadi outline solid.
  • double: digunakan untuk mengatur nilai properti menjadi outline double.
  • groove: digunakan untuk mengatur nilai properti menjadi outline 3D grooved.
  • ridge: digunakan untuk mengatur nilai properti menjadi outline 3D ridged.
  • inset: digunakan untuk mengatur nilai properti menjadi outline 3D inset.
  • outset: digunakan untuk mengatur nilai properti menjadi outline 3D outset.
  • initial: digunakan untuk mengatur nilai properti outline pada browser menjadi nilai default-nya.
  • inherit: digunakan untuk mengatur nilai properti outline menjadi nilai value dari elemen parent.

Return Value: method ini digunakan untuk mengembalikan nilai sebuah string yang merepresentasikan style dari elemen outline.

Baca Juga:

Contoh:

<!DOCTYPE html>

<html>

 

<head>

 

<title>

Properti Style outlineStyle 

DOM HTML

</title>

 

<style>

#myDiv 

{

border: 1px solid red;

outline: green dotted thick;

}

</style>

 

</head>

 

<body>

 

<h1>

Blog Elfan

</h1>

 

<h2>

Properti Style outlineStyle 

DOM HTML

</h2>

 

<div 

id="myDiv">

Selamat datang di Indomaret.

</div>

 

<br>

 

<button 

type="button" 

onclick="myFunction()">

Click Here!

</button>

 

<script>

function myFunction() 

{

document.getElementById("myDiv")

.style.outlineStyle = "solid";

}

</script>

 

</body>

 

</html>

Output:

Blog Elfan

Properti Style outlineStyle DOM HTML

Selamat datang di Indomaret.



Contoh:

<!DOCTYPE html>

<html>

 

<head>

 

<title>

Properti Style outlineStyle 

DOM HTML

</title>

 

<style>

#myDiv 

{

border: 1px solid red;

}

</style>

 

</head>

 

<body>

 

<h1>

Properti Style outlineStyle 

DOM HTML

</h1>

 

<div 

id="myDiv">

Selamat datang di Indomaret.

</div>

 

<br>

 

<button 

type="button" 

onclick="myFunction()">

Click Here!

</button>

 

<script>

function myFunction() 

{

document.getElementById("myDiv")

.style.outlineStyle = "dotted";

}

</script>

 

</body>

 

</html>

Output:

Properti Style outlineStyle DOM HTML

Selamat datang di Indomaret.


Artikel ini didedikasikan kepada: Destri Sinta Bela, Destyara Salsabila Ramadhani, Devi Maulina N.A Nur Alifah, Devina Ayu Septariza, dan Devita Aulia Putri Agmi.

5 komentar untuk "Mengatur Gaya Garis Luar HTML Menggunakan outlineStyle DOM"

  1. Jenis browser apas aja yang dapat digunakan untuk mengaktifkan properti outlineStyle DOM pada HTML?

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

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

    BalasHapus
    Balasan
    1. Properti outlineStyle DOM pada HTML merupakan properti yang digunakan untuk menetapkan atua mengembalikan style kerangka pada sekitar elemen. Outline merupakan garis yang terdapat pada sekitar elemen yang ditampilkan di sekitar margin elemen.

      Hapus
    2. Properti outlineStyle DOM pada HTML merupakan properti yang digunakan untuk mengembalikan dan memodifikasi kerangka elemen dalam dokumen HTML.

      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 -