Membuat garis lengkung Menggunakan Border Radius pada CSS
buayaberdiri.blogspot.com - Hari ini saya akan share cara membuat kotak background pada CSS dengan sisinya menjadi lengkung menggunakan sintaks CSS,ini bisa menjadi memperindah tampilan blog atau website kamu,CSS akan memperkenalkan border-radius,apa itu border radius ?
Border-radius adalah sintaks css yang digunakan untuk membuat radius pada sisi background atau sisi border/garis dengan satuan nilai pt,px,% dll.
Contoh sintaksnya :
<style>
#a1{
border-radius:15px;
}
</style>
#a1{
border-radius:15px;
}
</style>
Lihat contoh dibawah ini :
<!DOCTYPE>
<html>
<head>
<title>https://buayaberdiri.blogspot.com/</title>
<style>
#a1{
background-color:yellow;
color:red;
border: double 5px red;
padding:15px;
width:500px;
border-radius:15px;
}
</style>
</head>
<body>
<div id="a1">
<h1>https://buayaberdiri.blogspot.com/</h1>
</div>
</body>
</html>
<html>
<head>
<title>https://buayaberdiri.blogspot.com/</title>
<style>
#a1{
background-color:yellow;
color:red;
border: double 5px red;
padding:15px;
width:500px;
border-radius:15px;
}
</style>
</head>
<body>
<div id="a1">
<h1>https://buayaberdiri.blogspot.com/</h1>
</div>
</body>
</html>
Maka akan menampilkan seperti dibawah ini :
 |
| CSS Border Radius |
Nah sampai disini dulu yahh :)
Gbu:)
Jika kamu ingin melihat artikel tentang CSS dapat melihat disini
Baca Juga Artikel Lainnya : Cara mengatur lebar elemen tag div/margin/span/button dengan CSS
Baca Juga Artikel Lainnya : Contoh Penggunaan Float CSS
Tag : - cara membuat border-radius lingkaran css
- cara membuat border css