当前位置: 首页 > news >正文

【tips】小程序css ➕号样式

上传的时候一般页面显示的是加号。不用图片可以用样式实现;
在这里插入图片描述

wxss:

/* 加号 */
.plus-box {width: 91rpx;height: 91rpx;border-radius: 6rpx;background: rgba(204, 204, 204, 1);position: relative; /* 用于定位加号 */
}/* 水平线条 */
.plus-box::before {content: '';position: absolute;top: 50%;left: 50%;width: 40rpx; /* 横线长度 */height: 6rpx; /* 横线粗细 */background-color: white; /* 加号颜色 */transform: translate(-50%, -50%); /* 居中对齐 */border-radius: 3rpx; /* 线条圆角 */
}/* 垂直线条 */
.plus-box::after {content: '';position: absolute;top: 50%;left: 50%;width: 6rpx; /* 竖线粗细 */height: 40rpx; /* 竖线长度 */background-color: white; /* 加号颜色 */transform: translate(-50%, -50%); /* 居中对齐 */border-radius: 3rpx; /* 线条圆角 */
}

wxml

      <view class="plus-box"></view>
http://www.lryc.cn/news/603913.html

相关文章:

  • 项目质量如何把控?核心要点分析
  • 信号上升时间与带宽的关系
  • 技术QA | GNSS模拟器如何赋能自动驾驶?聚焦HIL、多实例与精准轨迹仿真的技术优势
  • leetcode 74. 搜索二维矩阵
  • 从传统到智能:Midscene.js 如何用 AI 颠覆自动化测试!
  • Baumer工业相机堡盟工业相机如何通过YoloV8深度学习模型实现各种食物的类型检测识别(C#代码UI界面版)
  • 【三桥君】企业级AI应用需要系统工程支撑,如何通过MCP大模型架构实现全链路实战解构?
  • 2.4G和5G分别指什么,什么是带宽(频谱带宽和网络带宽)
  • Solar月赛(应急响应)——攻击者使用什么漏洞获取了服务器的配置文件?
  • 数据结构 排序(1)---插入排序
  • 广泛分布于内侧内嗅皮层全层的速度细胞(speed cells)对NLP中的深层语义分析的积极影响和启示
  • 自动化测试实战篇
  • win10更新异常,导致Microsoft Store 无法正常启用,无法正常安装exe应用程序。
  • 银行交易欺诈检测模型分析
  • 微服务 01
  • 【C++算法】76.优先级队列_前 K 个高频单词
  • 【车联网kafka】Kafka核心架构与实战经验(第一篇)
  • 13、select_points_object_model_3d解析
  • 【2025年7月29日】TrollStore巨魔商店恢复在线安装
  • 通缩漩涡中的测量突围:新启航如何以国产 3D 白光干涉仪劈开半导体成本困局?
  • 磁悬浮转子同频振动:自适应陷波器设计与稳定性深度解析(附MATLAB代码)
  • 开源数据库PostgreSQL专家技术
  • AI药师助手 + 药品图谱系统完整操作分析(python版)
  • 基于AI代码疫苗技术的开源软件供应链安全治理
  • 出现错误,Microsoft store初始化失败。请尝试刷新或稍后返回。
  • 多模态融合 + 动态记忆机制,突破模态壁垒,超火研究方向
  • Xilinx高性能低延时PCIe-DMA控制器IP,SGDMA,QDMA,RDMA,CDMA,V4L2驱动,视频采集、AD采集
  • C#基础篇 - 正则表达式入门
  • 在Word和WPS文字中让文字无极限缩放,用键盘更高效
  • C51 中断