21/06/14, Kali ini saya akan membagikan kode html membuat border melengkung, tanpa banyak ngomong lagi langsung saja saya bagikan kode kodenya dan contohnya...
Berikut contoh dan kodenya :
<div style="-moz-border-radius: 20px 10px 20px 10px; -webkit-border-radius: 20px 10px 20px 10px; background-color: #0075a3; border-radius: 20px; border: 2px solid black; color: black; font-family: Arial; padding: 5px;"></div>
<div style="-moz-border-radius: 1em 0em 0em 0em; background-
color: orange; border-radius: 1em 0em 0em 0em; border: 2px solid #000; color: white; height: 12px; margin: 0 auto; overflow: hidden;"></div>
<div style="-moz-border-radius: 0em 0em 0em 1em; background-color: #0075a3; border-radius: 0em 0em 0em 1em; border: 2px solid #000; color: white; height: 12px;
margin: 0 auto; overflow: hidden;"></div>
<div style="-moz-border-radius: 0em 1em 0em 0em; background-color: #0075a3; border-radius: 0em 1em 0em 0em; border: 2px solid #000; color: white; height: 12px; margin: 0 auto; overflow: hidden;"></div>
<div style="-moz-border-radius: 0em 0em 1em 0em; background-color: #0075a3; border-radius: 0em 0em 1em 0em; border: 2px solid #000; color: white; height: 12px; margin: 0 auto; overflow: hidden;"></div>
<div style="-moz-border-radius: 1em 0em 0em 1em; background-color: #0075a3; border-radius: 1em 0em 0em 1em; border: 2px solid #000; color: white; height: 12px; margin: 0 auto; overflow: hidden;"></div>
<div style="-moz-border-radius: 1em 0em 0em 1em; background-color: #0075a3; border-radius: 1em 0em 0em 1em; border: 2px solid #000; color: white; height: 12px; margin: 0 auto; overflow: hidden;"></div
Silakan dicopy dan dilihat hasilnya
untuk menentukan garis melengkungnya ada di
BORDER-RADIUS.
border-radius: 1em 0em 0em 1em bisa kalian ubah dengan piksel PX
Contoh : border-radius: 4px 4px 4px 4px;
Kalian bisa mengembangkannya dengan editan kalian...sendiri !!!
Download
Oshable For Smartphone Anda.
Terimakasih anda telah membaca artikel tentang Membuat Style Border Melengkung HTML. Jika ingin menduplikasi artikel ini diharapkan anda untuk mencantumkan link https://iinformasii.blogspot.com/2014/06/membuat-style-border-melengkung-html.html. Terimakasih atas perhatiannya.