css3 border-radius_html/css_WEB-ITnose
- WBOY原創
- 2016-06-24 11:43:391081瀏覽
前缀对应浏览器
| 前缀 | 浏览器 |
| -webkit | chrome和safari |
| -moz | firefox |
| -ms | IE |
| -o | opera |
border-radius：
<style type="text/css">div.circle{ height:100px;/*与width设置一致*/ width:100px; background:#9da; border-radius:50px;/*四个圆角值都设置为宽度或高度值的一半*/ }div.same{ height:100px; width:50px; background:#9da;}.semi-circle{ border-radius:50px 0 0 50px; }.test{ border-radius: 50% 0 0 50%;} </style><body><div class="circle"></div><br/><div class="same semi-circle "></div><br/><div class="same test"></div></body> 可见设置50%和设置50px这样的固定值还是有差别的，没研究百分比以什么为参考，所以现在不知道怎样通过百分比设置一个左半圆。
参考：
https://css-tricks.com/almanac/properties/b/border-radius/
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn