[css] 请使用css画一个圆，方法可以多种

<div class="circle"></div>1.border-radius.cirlce{width:10vw; height:10vw; background:gray;border-radius:50%;
}2.clip-path.circle{width:10vw; height:10vw; background:gray;clip-path: circle();
}3.svg background.circle{
width:10vw; height:10vw; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='50%25' cy='50%25' r='50%25' fill='gray'/%3E%3C/svg%3E");
}4.radial-gradient.circle{width:10vw; height:10vw; background:radial-gradient(gray 70%, transparent 70%);
}5.font.circle::after {content: "●";font-size: 10vw;//字体实际大小line-height: 1;
}6.mix-blend-mode.circle{width: 10vw;height: 10vw;background: gray;
}
.circle::after {content: "";display: block;width: 10vw;height: 10vw;mix-blend-mode: lighten;background: radial-gradient(#000 70%, #fff 70%);
}

个人简介

我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题

[css] 请使用css画一个圆，方法可以多种相关推荐

【css】使用 canvas 画一个圆、贝塞尔曲线画对话气泡
画一个圆 HTML <canvas id="canvas"></canvas> JavaScript var canvas = document.getEl ...
[css] 请使用CSS画一个带锯齿形边框圆圈
[css] 请使用CSS画一个带锯齿形边框圆圈 @import 个人简介我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷.欢迎大家一起讨论主目录与歌谣一起通关前端面试题
[css] 请描述下你对translate()方法的理解
[css] 请描述下你对translate()方法的理解 Single length/percentage value一个长度值或百分比表示X轴和Y轴使用一样的值进行二维上的平移.等同于transla ...
[css] 请使用css写一个多级的下拉菜单
[css] 请使用css写一个多级的下拉菜单 <!DOCTYPE html> <html lang="en"><head><meta ch ...
[css] 请用css写一个扫码的加载动画图
[css] 请用css写一个扫码的加载动画图 @Keyframes donut-spin { 0% { transform: rotate(0deg); } 100% { transform: rot ...
[html] 请使用canvas画一个渐变的长方形
[html] 请使用canvas画一个渐变的长方形 // 普通canvas绘图工具类// umd适配多种引入方式 (function(root, factory) {if (typeof define ...
如何利用canvas画一个圆，并且填充颜色
如何利用canvas画一个圆,并且填充颜色(小白专用,大佬勿看) canvas基础相信在此之前,你对canvas已经有一定的了解了,接下来我将介绍,如何利用canvas画一个圆. 1.新建一个htm ...
PHP如何设置圆,php怎么画一个圆？
这篇文章主要介绍了php绘制圆形的方法,详细分析了php绘制图形的基本步骤与绘制圆形的实现方法,需要的朋友可以参考下本文实例讲述了php绘制圆形的方法.分享给大家供大家参考.具体实现方法如下: ph ...
用php画一个蓝底红色的圆_php 怎么画一个圆？
这篇文章主要介绍了php绘制圆形的方法,详细分析了php绘制图形的基本步骤与绘制圆形的实现方法,需要的朋友可以参考下本文实例讲述了php绘制圆形的方法.分享给大家供大家参考.具体实现方法如下: ph ...

[css] 请使用css画一个圆，方法可以多种

[css] 请使用css画一个圆，方法可以多种

个人简介

主目录

[css] 请使用css画一个圆，方法可以多种相关推荐

最新文章

热门文章