outline
Properti outline digunakan untuk menggambar outline di sekitar elemen.
Outline adalah garis yang digambar di luar batas elemen untuk membuatnya menonjol di halaman web.
Biasanya digunakan untuk alasan aksesibilitas, dan dapat digunakan untuk tujuan dekorasi.
Ouline mirip dengan border karena digambar di sekitar elemen dan dapat memiliki jenis gaya yang sama dengan yang dimiliki border, tetapi mereka berbeda dalam hal-hal berikut:
Outline tidak mengambil ruang. Outline bukan bagian dari elemen, sehingga tidak berkontribusi atau memengaruhi dimensi atau kotak elemen.
Outline digambar di sekitar empat sisi elemen. Kamu tidak dapat menentukan sisi tempat outline yang ingin kamu gambar.
Kamu tidak bisa menerapkan sudut bulat ke outline.
Outline mungkin non-persegi panjang.
Properti outline adalah properti singkatan untuk properti outline-width, outline-style, dan outline-color.
Outline biasanya ditarik tepat di luar tepi perbatasan. Namun, kamu dapat menggambar garis lebih jauh dari perbatasan
menggunakan properti outline-offset.
Properti outline-offset tidak ditetapkan sebagai bagian dari singkatan outline. Sehingga kamu harus mengaturnya
sendiri.
CSS Syntax
outline: outline-width outline-style outline-color | initial | inherit;
JavaScript Syntax
object.style.outline="#0000FF dotted 5px"
| Default value: | medium invert color |
|---|---|
| Inherited: | tidak |
| Animatable: | ya Read about animatable |
| Version: | CSS2 |
Attribute Value
default
outline: 4px dotted red;
- width
- style
- color
outline: 2px solid;
color yang opsional. Jika kamu menghilangkannya, warna yang diterapkan akan menjadi warna teks.