/* 天气版本 1 */
/* 添加空白图片在容器之上的样式，以防止鼠标点击 */
/*    #tianqifugai-image {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: url('path/to/blank-image.png') no-repeat center center;
        background-size: cover;
        z-index: 1;
    }
    @keyframes TQBJjianbiandonghua {
        0% { background-image: linear-gradient(to right, rgba(125, 125, 125, 0.5), rgba(125, 125, 125, 0)); }
        25% { background-image: linear-gradient(to right, rgba(125, 125, 125, 1), rgba(125, 125, 125, 0)); }
        50% { background-image: linear-gradient(to right, rgba(153, 51, 255, 0.5), rgba(153, 51, 255, 0)); }
        70% { background-image: linear-gradient(to right, rgba(153, 51, 255, 1), rgba(153, 51, 255, 0)); }
        100% { background-image: linear-gradient(to right, rgba(125, 125, 125, 0.5), rgba(125, 125, 125, 0)); }
    }
    #weather-wrapper {
        position: fixed;
        top: 20px;
        left: 3px;
        width: 102px;
        height: 30px;
        animation: TQBJjianbiandonghua 6s infinite linear;
        border-radius: 6px;
        z-index: -1;
    }
    #weather-iframe {
        position: absolute;
        top: -4px;
        left: 1px;
        width: 100%;
        height: 120%;
        border: none;
    } */
/*移动端效果*/
/*    @media screen and (max-width: 768px) {
        #tianqifugai-image {
            position: absolute;
        }
        #weather-wrapper {
            position: absolute;
        }
    } */



/* 天气版本 2 */
  .iframe-container {
    position: relative;
    display: flex; /* 使用Flexbox布局 */
  /*align-items: center;*/ /* 垂直居中 */
  /*justify-content: center;*/ /* 水平居中 */
    background: linear-gradient(to right, #005fea 0%, #00c2fa 60%, rgba(0, 128, 0, 0) 99%); /* 从左侧绿色到右侧透明的渐变 */
    border-radius: 10px 2px 2px 10px; /* 修改为左上和左下圆角样式 */
    padding: 5px;
    width: 140px; /* 设置容器宽度，包括内边距 */
    height: 30px; /* 设置容器高度，包括内边距 */
    overflow: hidden; /* 防止内容溢出圆角 */
    position: absolute; /* 绝对定位 */
    top: 20px; /* 顶部对齐 */
    left: 2px; /* 左侧对齐 */
  }
  .iframe-container iframe {
    border: none; /* 移除iframe的默认边框 */
    width: 350px; /* 设置iframe宽度 */
    height: 24px; /* 设置iframe高度 */
    position: relative; /* 使iframe内的滚动内容可以相对于容器定位 */
  }
  .fugai {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('fugai.png');
    background-size: cover;
    background-repeat: no-repeat;
  }
  @media only screen and (max-width: 768px) {
    .iframe-container {padding: 7px;}
  }
  /* 添加动画样式 */
  @keyframes scroll-left {
    from {
      transform: translateX(45%); /* 从容器右端开始 */
    }
    to {
      transform: translateX(-100%); /* 滚动到容器左端 */
    }
  }
  .iframe-container iframe {
    animation: scroll-left 10s linear infinite; /* 设置动画持续时间、速度和无限循环 */
  }