1

app/components/Carousel.tsx

@@ -25,6 +25,7 @@ export function CarouselDemo() {
   const [current, setCurrent] = React.useState(0);
   const [count, setCount] = React.useState(0);
   const totalSlides = imageUrls.length; 
+
   React.useEffect(() => {
     if (!api) return;
 
@@ -53,18 +54,18 @@ export function CarouselDemo() {
           {Array.from({ length: totalSlides }).map((_, index) => (
             <CarouselItem key={index} className="w-full h-full pl-0">
               <div className="p-0 w-full h-full">
-
-                  <CardContent className="flex aspect-square items-center justify-center p-0 w-full h-full m-0">
-                    <div 
+                <CardContent className="p-0 w-full h-full m-0"> {/* 移除了 aspect-square */}
+                  <div 
                     className="w-full h-full"
                     style={{
-                      backgroundImage: "url('/public/images/header.png')",//背景图片可修改
-                      backgroundSize: '100% 100%',
+                      backgroundImage: "url('/public/images/header.png')",
+                      backgroundSize: 'cover', // 改为 cover 以更好地适应容器
+                      backgroundPosition: 'center',
+                      backgroundRepeat: 'no-repeat',
                     }}
-                    >
-                    </div>
-                  </CardContent>
-
+                  >
+                  </div>
+                </CardContent>
               </div>
             </CarouselItem>
           ))}

app/components/news/body/FireNews/fhyw.tsx

@@ -1,17 +1,16 @@
 import { CarouselDemo } from "@/components/Carousel";
 import {FireNewsList} from "./FireNewsList";
 
-
 export function FhywPage() {
     return(
-    <div className="relative w-full max-w-4xl mx-auto overflow-hidden aspect-square">
+    <div className="relative w-350 h-225 mx-auto overflow-hidden bg-sky-700">
         {/* 轮播背景图 */}
-        <div className="absolute inset-0 z-0">
+        <div className="absolute top-0 left-0 w-full h-180">
             <CarouselDemo />
         </div>
         
         {/* 固定的烽火要闻 */}
-        <div className="absolute top-0 right-0 w-1/3 h-full p-1">
+        <div className="absolute top-0 right-0 w-1/3 h-200 p-1">
             <FireNewsList />
         </div>
     </div>