您的位置：首页技术文章
文章详情页

css3 - 这个效果用 CSS 可以实现吗？border-image

浏览：181日期：2023-07-13 14:21:24

问题描述

css3 - 这个效果用 CSS 可以实现吗？border-image

不想切整张图片，只把两个小球单独切出来，因为小球有闪动的效果。用了border-radius: 50%;画出一个圆，但border-image的小球仍然已正方形来排列。

代码放在jsbin上http://jsbin.com/redolerota/1/edit?html,...

问题解答

回答1：

demo

回答2：

用 CSS 畫就可以哩~https://jsbin.com/vozetu/

回答3：

圆底和小球边框分成两层，小球边框那一层用:after,罩在上面不就行了，可以不用border-image。。。

回答4：

并不能，老老实实用图片就是了，哪里搞这么多东西

回答5：

border-image好像不支持圆角，或者可以试试canvas绘图

回答6：

canvas画出来

回答7：

z-index分层试试

标签： CSS
上一条：css - outline 可以只设置一条边吗？下一条：css3 - css怎么实现图片环绕的效果
相关文章：
1. python - 求一个在def中可以实现调用本def满足特定条件continue效果的方法（标题说不太清楚，请见题内描述）2. $fields = $values = [];这条代码一直定义不了，一直报错，老师的源码也是被报错的,执行不了,请问该怎么解决这个问题3. MYSQL新建用户设置可以远程访问的问题4. node.js - nodejs和前端JavaScript 字符串处理结果不一样是什么原因？5. java - mybatis怎么实现在数据库中有就修改,没有就添加6. mysql - 我的myeclipse一直连显示数据库连接失败，不知道为什么7. linux - 为什么我在mysql的my.cnf下找不到bind-address？8. MySQL中的enum类型有什么优点？9. mysql多表联合查询优化的问题10. 数据库设计 - MySQL数据库主键问题
排行榜
$fields = $values = [];这条代码一直定义不了，一直报错，老师的源码也是被报错的,执行不了,请问该怎么解决这个问题
$fields = $values = [];这条代码一直定义不了，一直报错，老师的源码也是被报错的,执行不了,请问该怎么解决这个问题
1. python - 求一个在def中可以实现调用本def满足特定条件continue效果的方法（标题说不太清楚，请见题内描述）
2. MYSQL新建用户设置可以远程访问的问题
3. node.js - nodejs和前端JavaScript 字符串处理结果不一样是什么原因？
4. java - mybatis怎么实现在数据库中有就修改,没有就添加
5. angular.js - 为什么Angular2和Ionic2都用TypeScript开发，TypeScript有什么优势吗？
6. angular.js - angularjs的自定义过滤器如何给文字加颜色？
7. javascript - 如何将 windows 下编辑器中的 CRLF 替换为 LF?
8. docker-compose中volumes的问题
9. mysql - 我的myeclipse一直连显示数据库连接失败，不知道为什么
10. Android自定义相机预览
热门标签