From 2647a5a829f3554e985b1aac99c6a87892f42479 Mon Sep 17 00:00:00 2001
From: whycq <913841844@qq.com>
Date: 星期日, 22 十月 2023 18:21:56 +0800
Subject: [PATCH] #
---
pages/maoboli/maoboli.vue | 147 +++++++++++++++++++++++++++++++++++++++++++++++++
pages.json | 12 ++++
2 files changed, 159 insertions(+), 0 deletions(-)
diff --git a/pages.json b/pages.json
index 5077d69..987a5bc 100644
--- a/pages.json
+++ b/pages.json
@@ -2,6 +2,18 @@
"pages": [ //pages鏁扮粍涓涓�椤硅〃绀哄簲鐢ㄥ惎鍔ㄩ〉锛屽弬鑰冿細https://uniapp.dcloud.io/collocation/pages
{
+ "path" : "pages/maoboli/maoboli",
+ "style" :
+ {
+ "navigationBarTitleText": "姣涚幓鐠�",
+ "enablePullDownRefresh": false
+
+
+ }
+
+
+ },
+ {
"path": "pages/LoginDemo/LoginDemo",
"style": {
"navigationBarTitleText": "鐧诲綍"
diff --git a/pages/maoboli/maoboli.vue b/pages/maoboli/maoboli.vue
new file mode 100644
index 0000000..f213f2f
--- /dev/null
+++ b/pages/maoboli/maoboli.vue
@@ -0,0 +1,147 @@
+<template>
+ <view>
+ <view class="container">
+ dasdasdas dasd
+ </view>
+
+ <view class="box">
+ <view class="bg1">
+ 鑳屾櫙搴曞眰
+ </view>
+ <view class="bg2">
+ <view class="bg2-glass"></view>
+ <text class="text">鑳屾櫙涓婂眰</text>
+ </view>
+ </view>
+
+
+ <view class="box2">
+
+ </view>
+
+ <view class="box3"></view>
+
+ <view class="box4"></view>
+ </view>
+</template>
+
+<script>
+ export default {
+ data() {
+ return {
+
+ }
+ },
+ methods: {
+
+ }
+ }
+</script>
+
+<style>
+ :root {
+ --pcol: #888;
+ }
+ .container {
+ margin: 8px;
+ min-height: 100px;
+ font-size: 40px;
+ color: #ffffff;
+ background-color: #333;
+ filter: blur(.1px); /* 璁剧疆婊ら暅鏁堟灉 */
+ }
+ .container::before {
+ filter: blur(1px); /* 璁剧疆婊ら暅鏁堟灉 */
+ margin: 8px;
+ min-height: 100px;
+ }
+ .box {
+ background-color: azure;
+ position: relative;
+ margin: 8px;
+ }
+ .bg1 {
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ margin: 48rpx;
+ min-height: 200rpx;
+ background-color: #92cbff;
+ white-space: nowrap;
+ }
+ .bg2 {
+ position: absolute;
+ top: 80px;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ margin: 16rpx;
+ min-height: 200rpx;
+ }
+ .bg2-glass {
+ position: absolute;
+ content: '';
+ width: 0;
+ height: 0;
+ top: 20px;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ border-top: 10px solid transparent;
+ border-left: 10px solid transparent;
+ border-right: 10px solid transparent;
+ border-bottom: 10px solid red;
+ }
+ .bg2::before {
+ position: absolute;
+ content: '';
+ top: 0px;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background-color: rgba(255, 255, 255, .5);
+ backdrop-filter: blur(4px);
+ border: 1px solid #000;
+ }
+ .text {
+ position: absolute;
+ }
+ .box2 {
+ margin-top: 100px;
+ width: 0px;
+ height: 0px;
+ border: 100px solid transparent;
+ border-bottom-color: red;
+ }
+ .box3 {
+ width: 0px;
+ height: 0px;
+ border-top: 100px solid transparent;
+ border-left: 100px solid gray;
+ border-right: 100px solid transparent;
+ border-bottom: 100px solid gray;
+ }
+ .box4 {
+ width: 100%;
+ height: 100px;
+ background-color: #92cbff;
+ position: relative;
+ margin-top: 30px;
+ }
+ .box4::before {
+ position: absolute;
+ content: '';
+ width: 0;
+ height: 0;
+ top: -20px;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ border-top: 10px solid transparent;
+ border-left: 10px solid transparent;
+ border-right: 10px solid transparent;
+ border-bottom: 10px solid red;
+ }
+</style>
--
Gitblit v1.9.1