这是微信小程序排课功能用来上传下载文件的页面你能帮我写一个好看的、酷炫的样式吗给出wxss文件view class=container view class=download wxif=index==0 bindtap=downloadExcel view class=tips请按实例文件格式填写排课所需信息包括空闲教室课程名称等view view下载示例文件view im
.container { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; background-color: #f5f5f5; }
.download, .result, .upload { display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 20px 0; padding: 20px; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); border-radius: 10px; width: 80%; max-width: 400px; }
.download:hover, .result:hover, .upload:hover { box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); }
.download .tips { font-size: 14px; color: #999; margin-bottom: 10px; text-align: center; }
.download view, .result view, .upload view { font-size: 18px; color: #333; margin-bottom: 10px; }
.download image, .result image, .upload image { width: 100px; height: 100px; margin-bottom: 10px; }
.upload { background-color: #e5f5ff; color: #1e90ff; }
.upload image { width: 80px; height: 80px; margin-bottom: 20px; }
.schedule { background-color: #1e90ff; color: #fff; border: none; border-radius: 50px; padding: 10px 20px; font-size: 18px; margin-top: 20px; }
.schedule:hover { background-color: #00bfff; cursor: pointer; }
原文地址: https://www.cveoy.top/t/topic/bDcW 著作权归作者所有。请勿转载和采集!