<template>
  <div class="container mt-40 mx-auto">
    <h2 class="text-3xl font-bold mb-6 text-center text-gray-900 dark:text-white">新闻与活动</h2>
    <div class="flex space-x-8">
      <div class="w-1/3 h-96 border-gray-400 bg-white">
        <a href="">
          <img src="" alt="" class="w-full h-60 border border-gray-400">
          <div class="ml-4">
            <h3 class="text-lg font-bold mt-10">新闻标题1</h3>
            <h4 class="mt-2 mb-4">时间</h4>
            <p class="ml-2">新闻简要内容</p>
          </div>
        </a>
      </div>
      <div class=" w-1/3 h-96 border-gray-400 bg-white">
        <a href="">
          <img src="" alt="" class="w-full h-60 border border-gray-400">
          <div class="ml-4">
            <h3 class="text-lg font-bold mt-10">新闻标题1</h3>
            <h4 class="mt-2 mb-4">时间</h4>
            <p class="ml-2">新闻简要内容</p>
          </div>
        </a>
      </div>
      <div class="flex flex-col space-y-2 w-1/3 h-96 border-gray-400 bg-gray-100">
        <a href="" class="mt-4 ml-2 w-full h-20 hover:text-red-700">
          <h3 class="text-lg font-bold">新闻1</h3>
          <p>时间</p>
        </a>
        <a href="" class="ml-2 w-full h-20 hover:text-red-700">
          <h3 class="text-lg font-bold">新闻2</h3>
          <p>时间</p>
        </a>
        <a href="" class="ml-2 w-full h-20 hover:text-red-700">
          <h3 class="text-lg font-bold">新闻3</h3>
          <p>时间</p>
        </a>
        <a href="" class="ml-2 w-full h-20 hover:text-red-700">
          <h3 class="text-lg font-bold">新闻4</h3>
          <p>时间</p>
        </a>
        <a href="" class="ml-2 w-full h-20 hover:text-red-700">
          <h3 class="text-lg font-bold">新闻5</h3>
          <p>时间</p>
        </a>
      </div>
    </div>
  </div>
</template>
<script setup>
</script>