Pada Kesempatan kali ini saya akan membahas tentang Outline CSS. Outline CSS itu sendiri adalah salah satu property dalam css yang berfungsi untuk memberi garis atau batas bagian luar pada tag html.

Namun, outline CSS ini berbeda dengan border CSS. Apa bedanya?

Outline CSS tidak memiliki outline-top, outline-right, outline-bottom atau outline-left. Outline juga tidak berpengaruh terhadap width, contohnya jika temen temen membuat style dengan width 300px lalu menambahkan outline-width 20px, maka style awal tadi tetap memiliki width sebesar 300px. lain halnya jika menambahkan border-width 20px, maka style tadi akan memiliki width 340px karena (300px + 2 * 20px ).  Outline ini bisa kita tentukan bentuk atau tampilannya, seperti warna, ketebalan, serta stylenya.

Contohnya kita akan membuat outline pada sebuah paragraf

Buat Tag HTML dan isi dengan versi dummy

<div>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>

Style CSS nya sebagai berikut

<style>

div{outline:1px dotted #bbb}

</style>
Semoga Bermanfaat …