IE7/IE8浏览器纯CSS实现 【圆角】效果实例页面
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; }
HTML:
<div class="box"> <i class="radius"></i> <p class="text">美女</p> </div>
给心灵一个纯净空间,让思想,情感,飞扬!