.background-container {
            height: 370px; /* 容器高度 */
            background-image: url('https://ueeshop.ly200-cdn.com/u_file/UPBB/UPBB701/2306/photo/8a5f583486.jpg?x-oss-process=image/format,webp); /* 背景图片URL */
            background-size: 1920*370px; /* 背景图片覆盖整个容器 */
            background-repeat: no-repeat; /* 背景图片不重复 */
            position: relative; /* 设置为relative，使得内部的文字能相对于这个容器定位 */
        }

        .text-container {
            position: absolute; /* 绝对定位，可以让文字浮动在图片上 */
            top: 30%; /* 从顶部开始，将文字定位在容器的中央 */
            left: 30%; /* 从左侧开始，将文字定位在容器的中央 */
            transform: translate(-50%, -50%); /* 使用transform来精确定位文字 */
            color: #000000; /* 文字颜色，此处设置为黑色 */
            font-size: 48px; /* 文字大小 */
            font-weight: bold; /* 文字粗细 */
            text-align: center; /* 文字居中 */
        }

        .image-container {
            display: flex; /* 让图片并排显示 */
        }

        .hoverable-image {
            width: 300px; /* 图片初始宽度 */
            height: 300px; /* 图片初始高度 */
            transition: all 0.3s ease; /* 设置过渡效果 */
            box-sizing: border-box; /* 包含边框在元素的总宽度和高度内 */
        }

        .hoverable-image:hover {
            border: 2px solid blue; /* 鼠标悬停时边框变为蓝色 */
            transform: scale(1.2); /* 鼠标悬停时图片放大120% */
        }