dasar css (3) : Membuat Border / Garis Tepi

    Pada postingan kali ini ane akan menjelaskan  tentang pengertian border, padding dan margin pada sebuah dokumen html dan cara mengaturnya menggunakan CSS. tanpa CSS, dokumen HTML akan terlihat amburadul dan jelek.

    BORDER
    adalah sebutan untuk garis tepi, yaitu garus bentuk sebuah kolom. Dengan menggunakan command ini kita bisa mengubah ketebalan garis kolom, model kolom dan warna kolom.

    format:

    selector.class {border: ukuran tipe_garis warna}

    contoh:

    div {border: 1px solid red;}
    <div width="200px" height="100px"></div>

    atau bisa juga apabila mau menyeting per item:

    format:

    selector.class {
    border-top: ukuran tipe_garis warna;
    border-bottom: ukuran tipe_garis warna;
    border-left: ukuran tipe_garis warna;
    border-right: ukuran tipe_garis warna;
    }

    untuk contoh penggunaan

    selector.class {
    border-top: 1px solid pink;
    border-bottom: 2px dotted blue;
    border-left: 3px dashed green;
    border-right: 4px grove red;
    }
    <div width="200px" height="100px"></div>

    Untuk Value dari atribut tipe_garis ada: >> Solid
    >> Dotted
    >> Dashed
    >> Double
    >> Groove
    >> Ridge
    >> Outset
    >> Inset
    Silakan dicoba sendiri dan lihat perbedaannya 🙂

      Tinggalkan Balasan

      Alamat surel Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *