前言

第一版

核心代码段

HTML

<view class="content">
       <view class="title">温馨提示</view>
       <view class="main_content">抱歉！目前已经关闭该注册页面，如有需求请联系相关组织的负责人。</view>
</view>

WXSS

.content{
            color: #000;
            background: #ffc;
            width: 80%;
            height: 500px;
            box-shadow: 5px 7px 7px rgba(33, 33, 33, .7);
            margin-top: 10%;
            margin-left: 10%;
       
}
.title{
       border-bottom: 5px solid #A6A6A6; 
       font-size: 28px;
       font-family: Segoe UI, Tahoma, Geneva, Verdana, sans-serif;
       padding-top: 10px;
       padding-left: 30%;
}


.main_content{
       font-size: 30px;
       font-family:Georgia, ‘Times New Roman’, Times, serif;
       padding-left: 25px;
       padding-right: 25px;
       padding-top: 60px;
}

我的灵感一部分来自：

——————————————————————————————————————————

第二版

于2022.12.6更新：

更新内容：1.在原先基础上添加了背景图片

2.将左上角的返回栏隐藏，新增了返回的图标

核心代码段

WXML

<view class="imageBackground"><image class="background" src="/icon/background.jpg"></image></view>
<image class="return" src="/icon/return.png" alt="" style="width: 60px;height: 60px;" bindtap="return"/>
<view class="content">
       <view class="title">温馨提示</view>
       <view class="main_content">抱歉！目前已经关闭该注册页面，如有需求请联系相关组织的负责人。</view>
       <view class="postil">注：现在仅开放审批预约端和不受限预约端的注册</view>
</view>

WXSS

.content{
            position: absolute;
            color: #000;
            background: #ffc;
            width: 80%;
            height: 500px;
            box-shadow: 8px 10px 10px rgba(33, 33, 33, .7);
            margin-top: 30%;
            margin-left: 10%;
       
}

.title{
       border-bottom: 5px solid #A6A6A6; 
       font-size: 28px;
       font-family: Segoe UI, Tahoma, Geneva, Verdana, sans-serif;
       padding-top: 10px;
       padding-left: 30%;
}


.main_content{
       font-size: 30px;
       font-family:Georgia, ‘Times New Roman’, Times, serif;
       padding-left: 25px;
       padding-right: 25px;
       padding-top: 60px;
}

.postil{
       position: relative;
       font-size: 15px;
       padding-left: 25px;
       padding-right: 25px;
       top: 30%;
       color: red;
}
.box{
       height: 100%;
       background-color: rosybrown;
}
.background{
       width: 112%;
       height: 100%;
       position: absolute;
       z-index: -999;
}
.return{
       z-index: 999;
       position: absolute;
       top: 5%;
       left: 5%;
}

题外话