IE7/IE8浏览器纯CSS实现圆角效果
2018-08-24 18:06:27
905次阅读
0个评论
CSS代码:
.box {
width: 150px; height: 150px;
line-height: 150px;
position: relative;
overflow: hidden;
}
.radius {
position: absolute;
width: 100%; height: 100%;
border-radius: 50%;
border: 149px dotted;
/* IE7,IE8圆尺寸要小1像素同时有1像素偏移 */
margin: 0 0 1px 1px;
border-width: 0vw;
margin: 0vw;
color: #cd0000;
background-color: currentColor;
}
.text {
position: relative;
color: #fff;
text-align: center;
font-size: 24px;
}
<div class="box">
<i class="radius"></i>
<p class="text">圆形</p>
</div>
00