Tutorial : Curved Border dan Shadow

22 April 2013

curved border danshadow

Sebelum Siti nak lelap mata ni, baru je tadi curve kan body dan add curved shadow pada Simple template nie...

Caranya adalah seperti dibawah;

  1. Cari (Ctrl+F)
    .content-inner {

  2. Kemudian gantikan dengan
    .content-inner {
    -moz-border-radius-topleft: 20px;
    -moz-border-radius-topright: 20px;
    -moz-border-radius-bottomright: 0px;
    -moz-border-radius-bottomleft: 0px;

    -webkit-border-top-left-radius: 20px;
    -webkit-border-top-right-radius: 20px;
    -webkit-border-bottom-left-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;

    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;

    -moz-box-shadow: 0 0 26px 0px #EDEDED;
    -webkit-box-shadow: 0 0 26px 0px #EDEDED;
    box-shadow: 0 0 26px 0px #EDEDED;

Terpulang samada nak otter bahagian mana termasuk color dia...
Kalau nak otter shadow spread dia, otter bahagian ketiga-tiga line terakhir tu... dibahagian (26px)

Pada yang nak share, kredit backlink to mine... thank you...

Khadijah Firdaus
Superjo...Supermen...
Sudah baco...Harap komen...

1 comment: