css3径向渐变实现圆球
<div class="box"></div>
css
* {
margin: 0;
padding: 0;
}
.box {
width: 600px;
height: 600px;
/* border-radius圆角边框是CSS3的新属性,以前网页设计开发中要实现元素的圆角边框,通常是用背景图片来实现的。 */
border-radius: 50%;
margin: 20px auto;
/* circle at 100px 100px(高光出现在哪) */
background-image: radial-gradient(circle at 200px 200px, #5cabff, #000);
}
代码演示:
如果想实现椭圆,可以设置不同的宽高。
评论
匿名评论
隐私政策
你无需删除空行,直接评论以获取最佳展示效果