运动会宣传网页设计：带有滚动图片的 HTML 示例

当然可以！以下是一个带有滚动图片的宣传运动会的 HTML 网页设计示例：

<!DOCTYPE html>
<html>
<head>
  <title>运动会宣传</title>
  <style>
    /* CSS样式可以根据您的喜好进行更改 */
    body {
      font-family: Arial, sans-serif;
    }
    
    .header {
      text-align: center;
      padding: 20px;
      background-color: #f5f5f5;
    }
    
    h1 {
      color: #333333;
    }
    
    .content {
      margin: 20px;
    }
    
    .image-slider {
      width: 100%;
      height: 300px;
      overflow: hidden;
    }
    
    .image-slider img {
      width: 100%;
      height: auto;
      animation: slide 10s infinite;
    }
    
    @keyframes slide {
      0%, 20% {
        transform: translateX(0%);
      }
      25%, 45% {
        transform: translateX(-100%);
      }
      50%, 70% {
        transform: translateX(-200%);
      }
      75%, 95% {
        transform: translateX(-300%);
      }
      100% {
        transform: translateX(-400%);
      }
    }
    
    .event {
      margin-bottom: 20px;
      padding: 20px;
      background-color: #f5f5f5;
    }
    
    h2 {
      color: #333333;
    }
    
    p {
      color: #666666;
    }
    
    .cta-button {
      display: inline-block;
      background-color: #0099ff;
      color: #ffffff;
      text-decoration: none;
      padding: 10px 20px;
      border-radius: 5px;
      transition: background-color 0.3s;
    }
    
    .cta-button:hover {
      background-color: #0077cc;
    }
  </style>
</head>
<body>
  <div class="header">
    <h1>欢迎参加我们的运动会！</h1>
  </div>
  
  <div class="content">
    <div class="image-slider">
      <img src="image1.jpg" alt="运动会宣传图1">
      <img src="image2.jpg" alt="运动会宣传图2">
      <img src="image3.jpg" alt="运动会宣传图3">
    </div>
    
    <div class="event">
      <h2>跑步比赛</h2>
      <p>日期：2022年5月1日</p>
      <p>时间：上午9点至11点</p>
      <p>地点：市中心公园</p>
      <p>我们将举行一场令人兴奋的跑步比赛，让您挑战自我，与他人竞争。无论您是专业运动员还是业余爱好者，都欢迎参与！</p>
      <a class="cta-button" href="#">了解更多</a>
    </div>
    
    <div class="event">
      <h2>篮球比赛</h2>
      <p>日期：2022年5月2日</p>
      <p>时间：下午2点至5点</p>
      <p>地点：市体育馆</p>
      <p>我们将组织一场激动人心的篮球比赛，聚集各个年龄段的球迷和球员。无论您是球迷还是球队成员，都不要错过这个机会！</p>
      <a class="cta-button" href="#">了解更多</a>
    </div>
  </div>
</body>
</html>

请注意，示例中的滚动图片需要替换为您自己的图片。您可以在img标签的src属性中指定您的图片路径。

这个示例将在页面的顶部创建一个滚动图片栏，显示多张图片。下方是关于跑步比赛和篮球比赛的宣传活动信息。您可以根据需要自行调整样式和内容。希望这个设计能帮助到您！