Halo agan agan semua, kali ini saya masih akan membahas seputar dunia css. Setelah sebelumnya saya share
Cara agar postingan tidak bisa di copy paste menggunakan css
Fungsi a:hover dan a:visited di CSS


Kali ini saya akan membagikan salah satu keterampilan css yang harus dikuasai oleh seorang desainer web, yaitu membuat sudut melengkung atau biasa disebut rounded corner. Yang akan saya jelaskan pada kali ini adalah menggunakan CSS3, alasannya tentu lebih mudah dimengerti.

Kode yang digunakan adalah

-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;

Kode diatas akan membuat rounded pada setiap sudut selector yang kita tentukan.

Contoh penggunaannya

#sudut
{background: #6598CC;
height:100px;
width:200px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;}

Maka kode html yang digunakan adalah

<div ID="sudut">Masukan apa saja disini </div>

Untuk lebih jelasnya silahkan lihat gambar dibawah ini

membuat rounder corner dengan css

Bagaimana sobat, cukup mudah bukan? Silahkan dipelajari sampai bisa.