好看的背景颜色 uniapp+小程序

html 复制代码
<view class="bg-decoration">
   <view class="circle-1"></view>
   <view class="circle-2"></view>
   <view class="circle-3"></view>
</view>
css 复制代码
/* 背景装饰 */

.container{
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
	

.bg-decoration {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		pointer-events: none;
	}

	.circle-1,
	.circle-2,
	.circle-3 {
		position: absolute;
		border-radius: 50%;
		background: rgba(255, 255, 255, 0.1);
	}

	.circle-1 {
		width: 200rpx;
		height: 200rpx;
		top: -100rpx;
		right: -50rpx;
	}

	.circle-2 {
		width: 150rpx;
		height: 150rpx;
		bottom: 200rpx;
		left: -50rpx;
	}

	.circle-3 {
		width: 100rpx;
		height: 100rpx;
		bottom: 100rpx;
		right: 100rpx;
	}
相关推荐
2501_916008892 小时前
uni-app iOS 日志与崩溃分析全流程 多工具协作的实战指南
android·ios·小程序·https·uni-app·iphone·webview
Dark_programmer3 小时前
钉钉小程序 - - - - - 小程序内打开OA文档链接
小程序·钉钉
weixin_lynhgworld3 小时前
剧本杀APP系统开发:引领娱乐行业新潮流的科技力量
小程序·剧本杀
2501_915921434 小时前
iOS混淆工具实战 在线教育直播类 App 的课程与互动安全防护
android·安全·ios·小程序·uni-app·iphone·webview
流***陌5 小时前
医疗问诊陪诊小程序:以人性化设计构建健康服务新生态
小程序
织_网6 小时前
UniApp 页面通讯方案全解析:从 API 到状态管理的最佳实践
前端·javascript·uni-app
yuehua_zhang7 小时前
uni app 的app端 写入运行日志到指定文件夹。
前端·javascript·uni-app
说私域7 小时前
基于开源AI智能名片链动2+1模式S2B2C商城小程序的公益课引流策略研究
人工智能·小程序·开源
2501_915106327 小时前
Charles抓包工具在接口性能优化与压力测试中的实用方法
ios·性能优化·小程序·https·uni-app·压力测试·webview