Situseo Blog : Pengunaan sudut lancip pada border sudah mulai berkurang sekarang ini, dengan adanya css3 (border-radius) bentuk lengkung atau tumpul pada border sudah bisa dibuat, penggunaan border dengan bentuk lengkung lebih saya sukai dan saya banyak menggunakan bentuk lengkung ini pada blog.
Selain border, membuat background dengan warna gradient juga sudah bisa dibuat dengan menggunakan css3, seperti pada postingan sebelumnya mengenai Membuat Background Dengan Warna Gradient.
Dibawah ini merupakan beberapa contoh cara membuat border dengan garis lengkung :
Contoh Border 1
BORDER-1
.border-1 {
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
border: 2px solid #A89D61;
}
Contoh Border 2
BORDER-2
.border-2 {
-moz-border-radius-topleft: 30px;
-moz-border-radius-bottomright: 30px;
-webkit-border-top-left-radius: 30px;
-webkit-border-bottom-right-radius: 30px;
border: 2px solid #A89D61;
}
Contoh Border 3
CIRCLE
.circle {
-moz-border-radius: 80px;
-webkit-border-radius: 80px;
border-radius: 80px;
border: 2px solid #A89D61;
background:#D2CCAD;
width: 150px;
height: 150px;
}
Gantilah bagian warna bagian border sesuai dengan keinginan, untuk mempermudah pencarian warna yang sesuai, kalian bisa pergunakan tools warna pada bagian menu diatas.
Semoga bermanfaat,
Artikel Terkait:
Mengurangi Pemakaian Sudut Lancip Pada Border
Tutorial Buat Blog
- Cara Menghilangkan Widget Attribution Blogger
- Cara Kompress Template Blogger Agar Ringan
- Search Box Simpel dan Keren Untuk Blogspot
- Cara Menghilangkan Tulisan Powered by Blogger
- Cara Membuat Tulisan Copyright di Blog
- Cara membuat Header Menjadi dua Kolom ( templete Baru)
- Cara Menghapus Header Blog
- Cara Mudah Membagi Header Menjadi Dua
- Blog yang Disukai dan Dibenci Oleh Pengunjung
Posting Komentar