Apa itu border radius? Kalau border, pasti sobat tahu kan? Nah, hampir mirip dengan border itu. Border radius merupakan salah satu script CSS. Sedangkam fungsinya yaitu membuat lengkungan pada suatu item Html. Contohnnya, widget blog. Bentuknya kotak, tetapi apabila ditambahi border radius maka pada ujung-ujung kotak widget tersebut akan berubah. Berikut script Border-radius.
Alihkan perhatian ke setiap sudut kotak diatas. Sudut-sudut tersebut tidak lancip, benar kan? Sedikit tumpul. Jumlah ketumpulan tersbut adalah 10px. Jika sobat menambahi nilai 10px menjadi lebih tinggi maka setiap sudut akan semakin tumpul.
Ketumpulan pada SATU (1) sudut saja
Pada gambar diatas, semua sudutnya tumpul. Tetapi, bagaimana caranya agar hanya 1, 2, / 3 sudut saja yang tumpul? Lihat caranya di bawah ini!
Perhatikan.
Selanjutnya sobat coba-coba saja dari keempat angka tersebut dan lihat hasilnya. Ok cukup sampai di sini, semoga bermanfaat.
Source : http://www.blogseno.com/
#nama id widget/yang lainnya {Coba perhatikan pada script berwarna merah. Ya, itulah script border radius. Dari script tersebut, maka hasilnya seperti ini.
border-radius:10px;}
Alihkan perhatian ke setiap sudut kotak diatas. Sudut-sudut tersebut tidak lancip, benar kan? Sedikit tumpul. Jumlah ketumpulan tersbut adalah 10px. Jika sobat menambahi nilai 10px menjadi lebih tinggi maka setiap sudut akan semakin tumpul.
Ketumpulan pada SATU (1) sudut saja
Pada gambar diatas, semua sudutnya tumpul. Tetapi, bagaimana caranya agar hanya 1, 2, / 3 sudut saja yang tumpul? Lihat caranya di bawah ini!
Perhatikan.
Maka hasilnya seperti ini: border-radius: 0px (sudut kanan atas) 10px (sudut kiri atas) 0px (sudut bawah kiri) 10px (Sudut kanan bawah) :
border-radius: 0px 10px 0px 10pxContoh:
Maka hasilnya:
Selanjutnya sobat coba-coba saja dari keempat angka tersebut dan lihat hasilnya. Ok cukup sampai di sini, semoga bermanfaat.
Source : http://www.blogseno.com/
