Cara Membuat Garis Vertikal Dengan HTML dan CSS

Cara Membuat Garis Vertikal Dengan HTML dan CSS

Pastinya sudah sering mendengar HTML dan CSS. Yap, mereka seperti pasangan yang tidak dapat dipisahkan. Untuk tutorial kali ini kita dapat menggunakan CSS sebagai alat bantu untuk membuat garisnya. Di sini saya contohkan menggunakan tag div dengan menambahkan attribute style untuk mengisi CSS-nya (CSS internal).

Contoh kodenya :

<div style="width: 0px; height: 200px; border: 1px #000 solid;">
</div>

Di kode tersebut terlihat saya membuat width atau panjangnya adalah 0 agar tidak ada tempat kosong dan height atau tingginya 200px.
Di situ juga saya beri border setebal 1px berwarna hitam dan bersifat solid, kalau value solid pada properti border dihilangkan maka garis vertikal tidak akan terlihat, kalau value solid diganti dengan dotted, dashed, atau double, maka garis vertikal yang ditampilkan juga akan sesuai sifat border tersebut.

Contoh hasil :

Mungkin itu saja yang dapat saya bagikan kali ini. Semoga bermanfaat, terima kasih.