效果图

CSS样式

/*加载中*/
#loading-overlay {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0, 0, 0, 0.5); /* 半透明背景 */display: flex;justify-content: center;align-items: center;
}.loading-container {position: fixed;top: 40%;left: 30%;height: 200px;margin: 0 auto;z-index: 10001;
}
.loading-container img{width: 150px;height: 150px;
}.loading-container div{position: relative;top:0%;left: -5%;color: #46AAF7;font-size: 0.35rem;font-weight: 600;
}

HTML

<div id="loading-overlay" style="display:none"><div class="loading-container" style="display:none"></div>
</div>

JQ

//     加载
$('.loading-container').append('<img class="loading-animation" src="/newadmin/images/loadingimg.gif" alt="Loading..."><div>正在智能生成训练题</div>');
$("#loading-overlay").fadeIn()
$('.loading-container').fadeIn()