CSS+DIV实现圆角按钮效果

< html >
< head >
< title > 纯css实现圆角按钮 </ title >
< style type ="text/css" >
.a { float : left ; border-width : 1px 0 ; border-color : #bbbbbb ; border-style : solid ; }
.b { height : 22px ; border-width : 0 1px ; border-color : #bbbbbb ; border-style : solid ; margin : 0 -1px ; background : #e3e3e3 ; position : relative ; float : left ; }
.c { line-height : 10px ; color : #f9f9f9 ; background : #f9f9f9 ; border-bottom : 2px solid #eeeeee ; }
.d { padding : 0 8px ; line-height : 22px ; font-size : 12px ; color : #000000 ; clear : both ; margin-top : -12px ; cursor : pointer ; }
</ style >
</ head >
< body >
< div class ="a" >
< div class ="b" >
< div class ="c" > &nbsp; </ div >
< div class ="d" > css圆角按钮 </ div >
</ div >
</ div >
</ body >
</ html >

 

css圆角按钮

 

 

转载于:https://www.cnblogs.com/baogg/articles/1945719.html