css实现纯加号

bash 复制代码
<!DOCTYPE html>  
<html>  
<head>  
<style>  
.circle-plus {  
  position: relative;  
  width: 50px;  
  height: 50px;  
  border-radius: 50%;  
  background-color: #3498db;  
  display: flex;  
  align-items: center;  
  justify-content: center;  
}  
  
.circle-plus::before, .circle-plus::after {  
  content: '';  
  position: absolute;  
  background-color: #fff;  
}  
  
.circle-plus::before {  
  width: 2px;  
  height: 20px;  
  top: 15px;  
  left: 24px;  
}  
  
.circle-plus::after {  
  width: 20px;  
  height: 2px;  
  top: 24px;  
  left: 15px;  
}  
</style>  
</head>  
<body>  
  
<div class="circle-plus"></div>  
  
</body>  
</html>
相关推荐
十一.3662 分钟前
012-014 对state的理解,初始化state,react中的事件绑定
前端·react.js·前端框架
你脸上有BUG2 分钟前
SSE库选型+fetch-event-source示例
前端·sse·通知订阅
Never_every994 分钟前
8 个高清 4K 视频素材网址!无水印可商用
大数据·前端·音视频·视频
NotFound4867 分钟前
分享实战中Python Web 框架对比:Django vs Flask vs FastAPI
前端·python·django
冰暮流星7 分钟前
javascript之表单事件1
开发语言·前端·javascript
Dalydai12 分钟前
AI 辅助前端开发:两个月踩坑实录
前端·ai编程
前端那点事13 分钟前
Vue跨页面通信(8种主流方式|完整可运行Demo,Vue2/Vue3通用)
前端·vue.js
a_Ichuan14 分钟前
在HBuilderX创建的uniapp项目中使用unocss
前端·uni-app
里欧跑得慢16 分钟前
12. CSS滤镜效果详解:为页面注入艺术灵魂
前端·css·flutter·web
里欧跑得慢17 分钟前
CSS 级联层:控制样式优先级的新方式
前端·css·flutter·web