Membuat Rounded Border

Saturday, April 14, 2012

Biasanya border secara defaultnya memiliki siku 90 derajat. Sedangkan ada beberapa orang yang memiliki selera agar border tidak memiliki sudut melainkan terlihat rounded. Caranya tidak sulit cukup menggunakan kode seperti dibawah ini.

border:1px solid grey;
border-radius:10px;
-moz-border-radius:10px; -untuk mozilla tambahkan -moz- -
-webkit-norder-radius:10px; -untuk safari dan chrome tambahkan -webkit- -

Catatan : 10px bisa diganti sesuai selera anda, misal menjadi 5px atau 15px. Semakin besar, maka akan semakin melengkung. Mari kita mulai, berikut ini adalah hasil dari penambahan kode.

Menggunakan radius sebesar 10 pixel

Menggunakan radius sebesar 20 pixel

Menggunakan radius sebesar 40 pixel

Silahkan anda coba untuk memodifikasi tempalate blog anda, atau memperbaik tampilan blog dan postingan anda. :)

0 comments:

Post a Comment

 

Copyright © 2011 Mixx Blogger Template - Blogger Templates by BloggerReflex

Sponsored by: Trucks | SUV | Cheap Concert Tickets