前缀对应浏览器
前缀 | 浏览器 |
-webkit | Chrome和safari |
-moz | |
-ms | IE |
-o |
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/
新闻热点
疑难解答