Membuat Garis Lengkung

Maaf Membuat blog yang indah dan sedap dipandang oleh mata pastinya menjadi tujuan dari teman-teman blogger.. Karena saya lebih menyukai tampilan blog yang simpel dan tidak berat loading pagenya, akhirnya saya mencari ke temen blogger "kang angga" dan dapat ilmunya kemudian saya praktekkan dengan efek yang lebih segar dan rapi untuk setiap kolom di blog saya ini.  Dalam posting kali ini,kita akan belajar bagaimana cara membuat efek lengkung pada border.contohnya bisa anda lihat di garis tepi kolom post ini.. tertarik untuk membuatnya juga..??.Check this out… Big Hug


1. Login ke blogger dengan account anda.Lalu ke TATA LETAK –> EDIT HTML.
2. Cari kode h2.date-header { , Lalu letakkan kode di bawah ini setelah kode tersebut 

border-left:3px solid #c0c0c0;
border-right:3px solid #c0c0c0 
border-top:3px solid #c0c0c0;
border-bottom:0px solid #c0c0c0;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
3. Cari kode .post-body { , Lalu letakkan kode di bawah ini setelah kode tersebut. 
border-right:3px solid #c0c0c0;
border-left:3px solid #c0c0c0;
4. Sudah..??,sekarang cari kode .post-footer { , Lalu tambahkan kode di bawah ini setelah kode tersebut.
border-left:3px solid #c0c0c0;
border-right:3px solid #c0c0c0;
border-top:0px solid #c0c0c0;
border-bottom:3px solid #c0c0c0;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
5. Simpan kerja anda.
6. Nikmati hasil pekerjaan anda barusan dengan mengklik tab Lihat Template.. sekarang kolom posting anda sudah lebih menarik bukan..??^^

Untuk mengganti border pada kolom sidebar,anda hanya perlu menempatkan kode dibawah ini setelah kode .sidebar .widget {

border:1px solid #c0c0c0;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px
  • Selesai deh… mudah kan..? Happy

0 comments:

Followers

Total Pageviews

Popular Posts

 
© Abu Fawwaz Offical WebBlog : SOOHOO21 , Offical Web : SOOHOO21
Template by : G-JO
;