码迷,mamicode.com
首页 > Web开发 > 详细

css3 border-radius 总结

时间:2016-04-05 15:43:03      阅读:192      评论:0      收藏:0      [点我收藏+]

标签:

参考:http://blog.sina.com.cn/s/blog_61671b520101gelr.html

技术分享

 <div class="d radius1"></div>
      <div class="d radius2"></div>
      <div class="d radius3"></div>
      <style type="text/css">
      .d{width: 150px; height: 150px; background: red; float: left; margin-left: 20px;}
      .radius1{border-radius: 50px;}
      .radius2{border-radius: 50px 100px;}
      .radius3{border-top-left-radius:50px; border-top-right-radius:30px; border-bottom-left-radius:50px;border-bottom-right-radius:30px;}
  .radius4{height:100px; width:200px; background: red; border-radius:100px/50px;}//相当于“/”前后的值都存在,那么“/”前面的值设置其水平半径,“/”后面值设置其垂直半径。
</style>

 

css3 border-radius 总结

标签:

原文地址:http://www.cnblogs.com/haitangxun/p/5354799.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!