Ring ring

Property dan value (border , padding & margin) css

Dalam css penulisanya begini:
selector{border:value}

ket:
disini value diisi dengan ukuran ,jenis border dan warna

contoh:
selector{border:1px solid red}

ket:
>1px adalah ukurannya
>solid adalah jenis border,dan
>red adalah warna-nya,.

dalam contoh diatas kita sedang mengatur border selector secara keseluruhan,
bisa juga kita memasang border hanya pada satu sisi saja atau 2 sisi,

contoh:
>border bagian atas
selector{border-top:1px solid red}

>border bagian bawah
selector{border-bottom:1px solid red}

>atau juga kita bisa menuliskan 2 border dalam selector

contoh:
selector{border-top:1px solid red; border-bottom:1px solid red}

ket:
ingat !!,.
dalam pemisahan property gunakan tanda titik atas dan koma ( ; ) dan untuk penunjukan border pisahin dengan tanda strip tengah ( - )

tambahan:
nama2 border yang dapat kamu pasang,
>border-top=atas
>border-right=kanan
>border-bottom=bawah
>border-left=kiri

>>
hanya untuk tambahan dari penjelasan padding dan margin dalam penulisan-nya..

perhatikan contoh berikut:

>a.
selector{padding:1px}
>b.
selector{padding:1px 2px}
>c.
selector{padding:1px 2px 3px}
>d.
selector{padding:1px 2px 3px 4px}

ket:
dalam contoh diatas
>a=kita mengatur jarak kedalam isi secara keseluruhan.
>b=dengan contoh itu kita mengatur jarak kedalam isi atas dan bawah 1px, kanan dan kiri 2px..
>c=dari contoh c kita mengatur jarak kedalam isi dengan rincian sebagai berikut:
>1px bagian atas
>2px bagian samping kanan ,dan
>3px bagian bawah
>nb:
jadi aturannya searah jarum jam,.
>d=penjelasanya sama dengan contoh c
hanya saja bagian samping kiri dengan isi berjarak 4px

MARGIN>>
untuk margin caranya penulisanya sama saja dengan padding ,.
hanya saja kegunaan MARGIN adalah kebalikan dari padding,yaitu mengatur jarak bagian keluar dari suatu elemmen,.

contoh:
kita mengatur body

#header{margin:1px}

ket:
jadi jarak tepi header dengan elemen luar adalah 1px

tambahan:
dalam penulisan padding atau margin dapat gunakan alat penunjuk seperti pengaturan border

diantaranya:
>padding-top
>padding-right
>padding-bottom
>padding-left

begitu juga dengan margin
>margin-top
>margin-right
>margin-bottom
>margin-left

dari semua itu gunakan seperlunya saja, dan sekian penjelasan dari border, serta tambahan buat padding dan margin

semoga mudah dipahami dan tentunya harapan,adalah bermanfaat...

dan,terimakasih sudah meluangkan waktu-nya

salam newbie

Back to posts
Comments:
[2015-07-06 03:51] Budurunnafis Ulul Azmi:

thanks infonya...
sangat bermanfaat. :) ;)

[2013-05-11 06:09] Aboeds:

Lebih lengkap kalo pake scrnshot gan..:)


Post a comment

Home
51426