Mengatur Gaya Garis Luar HTML Menggunakan 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, Mengatur Warna Garis Luar HTML Menggunakan outlineColor Style DOM, dan Mengatur Garis Luar HTML Menggunakan Outline Style DOM.
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.
<!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>
Blog Elfan
Properti Style outlineStyle DOM HTML
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
- 4 Contoh Properti Padding Style DOM pada HTML
- 4 Value Properti paddingBottom Style DOM pada HTML
- 5 Value Properti paddingLeft Style DOM pada HTML
- 4 Value Properti paddingRight Style DOM pada HTML
- 4 Value Properti paddingTop Style DOM pada HTML
- 8 Value Properti pageBreakAfter Style DOM pada HTML
- 8 Value Properti pageBreakBefore Style DOM pada HTML
5 komentar untuk "Mengatur Gaya Garis Luar HTML Menggunakan outlineStyle 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 apas aja yang dapat digunakan untuk mengaktifkan properti outlineStyle DOM pada HTML?
BalasHapusBerikut adalah beberapa jenis browser yang dapat digunakan untuk mengaktifkan properti outlineStyle DOM pada HTML:
Hapus1. Google Chrome
2. Internet Explorer
3. Firefox
4. Opera
5. Safari
Apa yang dimaksud dengan properti outline Style DOM pada HTML?
BalasHapusProperti 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.
HapusProperti outlineStyle DOM pada HTML merupakan properti yang digunakan untuk mengembalikan dan memodifikasi kerangka elemen dalam dokumen HTML.
Hapus