HTML CSS examples for CSS Property:border-radius
Using Border-radius to create tab title bar
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .active{<!-- w w w . j a v a2s . co m--> border:1px solid red; border-bottom:0; width:80px; height:40px; margin:30px; position:relative; -moz-border-radius:5px 5px 0 0; -webkit-border-radius:5px 5px 0 0; } .active:after, .active:before{ content:''; width:40px; height:30px; border:1px solid red; position:absolute; bottom:-3px; border-top:0; } .active:after{ border-left:0; -moz-border-radius:0 0 5px 0; -webkit-border-radius:0 0 5px 0; left:-41px; } .active:before{ border-right:0; -moz-border-radius:0 0 0 5px; -webkit-border-radius:0 0 0 5px; right:-41px; } </style> </head> <body> <div class="active"> hi </div> </body> </html>