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

[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%);
}

个人简介

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

主目录

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/412984.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

springboot中getOutputStream() has already been called for this response和java.io.FileNotFoundException

这个异常挺多人遇到的&#xff0c;不过我看了一下&#xff0c;跟我们的情况都不一样。 1. 流没关闭。 2. 未设置响应头。 3. jsp页面需要清空流。说一下我们遇到的情况。就是一个简单的sprinboot项目。 用的是springboot 1.5.6&#xff0c;本地启动后用花生壳内网映射…

eclipse搜索框太小

解决方式&#xff1a; Window>Preferences>DevStyle>Inline Search 把 use the inline search 取消勾选

fileinput 加 ftp 加 nginx 加 SpringBoot上传文件

亲测可用 准备linux服务器 https://www.cnblogs.com/shuaifing/p/8268949.html 搭建ftp https://www.cnblogs.com/shuaifing/p/8260532.html Springboot整合fileinput 上传文件https://www.cnblogs.com/shuaifing/p/8274906.html 页面 引入 jquery boostrap fileinput.min.js…

[css] css中最常用的字体有哪些?你是怎么选择字体的?

[css] css中最常用的字体有哪些&#xff1f;你是怎么选择字体的&#xff1f; 总结&#xff1a; win&#xff1a;微软雅黑为Win平台上最值得选择的中文字体&#xff0c;但非浏览器默认&#xff0c;需要设置&#xff1b;西文字体的选择以Arial、Tahoma等无衬线字体为主。 mac&am…

springboot redis shiro 实现 单点登录

大家好&#xff0c;我是烤鸭&#xff1a;今天给大家分享简单的单点登录的实现方式。环境及jar包:springboot 1.5.10 redis 2.9.0 &#xff08;可以用tomcat的session&#xff0c;但是无法解决多个tomcat共享session的问题&#xff09;shiro 1.4.0 lombok …

IntelliJ IDEA 控制台最大化

快捷键一&#xff1a; ctrlshift方向键上下 快捷键二&#xff1a; CtrlShift"

Centos7安装Hadoop教程

一&#xff1a;安装SSH 1&#xff0c;执行下面的命令安装ssh yum install openssh-clients yum install openssh-server 2&#xff0c;执行如下命令测试一下 SSH 是否可用&#xff08;SSH首次登陆提示 yes/no 信息&#xff0c;输入 yes 即可&#xff0c;然后按照提示输入 root…

[css] 请举例说明css有哪些不可继承的属性?

[css] 请举例说明css有哪些不可继承的属性&#xff1f; 1、display&#xff1a;规定元素应该生成的框的类型2、文本属性&#xff1a;vertical-align&#xff1a;垂直文本对齐text-decoration&#xff1a;规定添加到文本的装饰text-shadow&#xff1a;文本阴影效果white-space&…

elasticsearch 6.x (一) 部署 windows入门 spingboot连接

大家好&#xff0c;我是烤鸭&#xff1a;今天分享的是 elasticsearch 6.x 部署 windows服务器。环境&#xff1a;win10elasticsearch-6.2.4springboot 2.0.0.RELEASE1. 官网下载elasticsearch这个是最新版本的es下载地址。https://www.elastic.co/downloads/elasticsearch选择z…

Programming Assignment 5: Burrows–Wheeler Data Compression

Programming Assignment 5: Burrows–Wheeler Data Compression 1. 题目阅读 实现Burrows-Wheeler数据压缩算法。这个革命性的算法产生了gzip和pkzip&#xff0c;并且相对容易实现&#xff0c;还不受任何专利保护。它构成了unix压缩实用程序bzip2的基础。 这个算法由以下三种算…

hadoop Connection refused: no further information原因排查(Centos7)

一&#xff1a;排查防火墙&#xff0c;是否开放9000端口 firewall-cmd --list-ports查看防火墙是否有9000端口&#xff0c;如果没有&#xff0c;通过下面的命令添加端口&#xff1a; firewall-cmd --zonepublic --add-port9000/tcp --permanent systemctl restart firewalld…

[css]你有使用过preload、preconnect、prefetch这些属性吗?说说它们都有什么作用?

[css]你有使用过preload、preconnect、prefetch这些属性吗&#xff1f;说说它们都有什么作用&#xff1f; preload 元素的 rel 属性的属性值preload能够让你在你的HTML页面中元素内部书写一些声明式的资源获取请求&#xff0c;可以指明哪些资源是在页面加载完成后即刻需要的。…

elasticsearch 6.x (二) linux部署 kibana x-pack 安装

大家好&#xff0c;我是烤鸭&#xff1a; 环境&#xff1a;linux Cent OS 7.3elasticsearch-6.2.4 1. 下载elasticsearch https://www.elastic.co/downloads/elasticsearch 上面的网址直接下载的话&#xff0c;实在太慢了。官方还提供了另一种方式。 https://www.elastic.co…

Kali Linux ——在无网络情况下安装无线网卡驱动

1、背景&#xff1a; 今日刚刚开始学习kali linux&#xff0c;众所周知&#xff0c;安装完成后&#xff0c;系统是没有无线网卡驱动的&#xff0c;这就对学生党造成相当的困扰&#xff1a;校园网要连接有线是需要认证客户端的&#xff0c;而认证客户端只有windows端&#xff0c…

HADOOP_HOME and hadoop.home.dir are unset 报错处理

一般是windows才会出现这个问题 请看下面的解决方案&#xff1a; 第一步&#xff1a;下载winutils-master.zip Gitee地址&#xff1a;https://gitee.com/nkuhyx/winutils.git 蓝奏云&#xff1a;https://www.lanzoux.com/i55ccnc Github地址&#xff1a;https://github.com/cda…

[css] 你是怎样对css文件进行压缩合并的?

[css] 你是怎样对css文件进行压缩合并的&#xff1f; 使用在线网站进行压缩&#xff0c;如http://tool.lu/css如使用Gulp&#xff0c;可使用gulp-minify-css进行压缩如使用WebPack&#xff0c;可使用optimize-css-assets-webpack-plugin进行压缩个人简介 我是歌谣&#xff0c;…

elasticsearch 6.x (三) linux 集群多节点部署

大家好&#xff0c;我是烤鸭&#xff1a;关于集群内单个节点部署&#xff0c;请参考上一篇文章。elasticsearch 6.x linux部署(二) kibana x-pack 安装环境&#xff1a;linux Cent OS 7.3elasticsearch-6.2.41. 下载多个es安装每个安装步骤都是一样的。2. 修改配置文件(重…

ztree改变节点颜色

//找到节点对象 var node ztree.getNodesByParam("id",aaaaaaaaaabbbbbb, null)[0]; if(node!null){//找到span标签&#xff0c;并改变颜色$("#"node.tId"_span").css("color",red); }

版本下载地址

http://chromedriver.storage.googleapis.com/index.html转载于:https://www.cnblogs.com/nvhanzhi/p/9887999.html

[css] css3和css2的区别是什么?

[css] css3和css2的区别是什么&#xff1f; css3增加了更多特性&#xff1a;动画、过渡效果&#xff0c;圆角、文字特效等个人简介 我是歌谣&#xff0c;欢迎和大家一起交流前后端知识。放弃很容易&#xff0c; 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关前端…