Cara Membuat garis lengkung pada sudut border

by - 12/08/2012

Para bloggers mungkin tidak asing lagi dengan namanya border, mungkin disetiap blog kita bisa menemukan adanya pemberian border. Namun selama pantauan saya dalam mengamati perkembangan blog-blog yang ada, saya jarang sekali menemukan adanya blog menggunakan garis lengkung pada sudut border. Saya tidak tahu apakah mereka sebelumnya sudah tahu bagaimana cara membuat garis lengkung border atau mereka sama sekali tidak tahu membuatnya? Nah,... jika kebetulan Anda belum bisa membuat garis lengkung ini, Anda dapat mengikuti tutorialnya dibawah ini.

Tutorialnya sangat gampang sekali, jika Anda memperhatikannya.

1. Login ke www.blogger.com
2. Pilih Dashboard -> Tata letak -> Edit HTML

3. Sebagai contoh, saya akan menggunakan border dari posting. Anda cari kode yang mirip dengan ini :

.post {
margin:0px 0px 15px 0px;
padding:10px;
background: #FFFFFF;
border:1px solid #cccccc;
}

4. Ingat kode yang Anda cari tidak lah harus sama dengan diatas karena templates setiap orang berbeda-beda. Yang terpenting cari bagian .post {
5. Jika sudah ketemu Anda tambahkan kode dibawah ini tepat dibawah border:1px solid #cccccc;

Kode:
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;

sehingga menjadi:
.post {
margin:0px 0px 15px 0px;
padding:10px;
background: #FFFFFF;
border:1px solid #cccccc;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
}

Ket:
-moz-border-radius-bottomleft:5px; = membuat lengkung bagian kiri-bawah
-moz-border-radius-bottomright:5px; = membuat lengkung bagian kanan-bawah
-moz-border-radius-topleft:5px; = membuat lengkung bagian kiri-atas
-moz-border-radius-topright:5px; = membuat lengkung bagian kanan-atas

6. Jika sudah klik tombon Simpan -> Lihat blog

Mulai sekarang Anda sudah tahu kan bagaimana membuatnya....
Semoga dari tutorial ini, Anda akan lebih semangat lagi dalam mengedit blog Anda sendiri karena kebanyakan orang membuat blog tinggal CP (copy-paste) template seseorang.

Ok lah begitu,... sekian dari tutorial saya ini. Jangan lupa komentarnya y....

NB : Jika Anda puas dengan tutorial diatas Anda dapat mengekspresikannya dengan memilih salah satu dari text link dibawah ini.

Sumber : http://daisuki-zutto.blogspot.com/2010/02/membuat-garis-lengkung-pada-sudut.html

You May Also Like

3 comments

  1. wow keren ne kk biar tambah keren blog kita
    bondowoso-jawa.blogspot.com

    BalasHapus
  2. Ok Keren Sob !!

    [-]http://miki-maru.blogspot.com/

    BalasHapus
  3. Iffat gimana cari kode .post { yg mirip di atas kok gk ada yg mirip si, gimana ?

    BalasHapus

Untuk menyisipkan kode pendek, gunakan ... KODE ...
Untuk menyisipkan kode panjang, gunakan ... KODE ...
Untuk menyisipkan gambar, gunakan ... URL GAMBAR ...

Rules :
-DONT SPAM
-DONT FLOOD
-DONT PORNO
-DILARANG NGEMIS/MINTA TEMPLATE IFFAT BLOGGER
-DILARANG BERKOMENTAR DENGAN KATA AGAN.
-BILA ANDA INGIN MENDAPATAKAN INFO YANG TERUPDATE GAME PC DI BLOG INI SILAHKAN FOLLOW BLOG INI
-GUNAKANLAH BAHASA YANG SOPAN DAN BERETIKA
-FOLLOW BLOG INI MAKA SAYA AKAN FOLLBACK