This commit is contained in:
Li1304553726 2025-11-20 10:50:32 +08:00
commit 496b7fc8d7
1 changed files with 11 additions and 11 deletions

View File

@ -23,12 +23,12 @@ const LearnPage = () => {
</div>
{/* 主内容区:固定高度,紧凑布局 */}
<div className="flex flex-col lg:flex-row gap-4 h-[740px]">
<div className="flex flex-col lg:flex-row h-[740px]">
{/* 左侧图片区 */}
<div className="lg:w-3/5 rounded-lg overflow-hidden">
<div className="grid grid-cols-3 grid-rows-2 gap-3 h-full w-full">
<div className="lg:w-3/5 overflow-hidden">
<div className="grid grid-cols-3 grid-rows-2 h-full w-full">
{/* 上左:第一张图 */}
<div className="row-span-1 col-span-1 rounded-lg shadow-sm overflow-hidden">
<div className="row-span-1 col-span-1 shadow-sm overflow-hidden">
<img
src="/images/carousel-1.jpg"
alt="Image 1"
@ -37,7 +37,7 @@ const LearnPage = () => {
</div>
{/* 上右:轮播图 */}
<div className="col-span-2 row-span-1 rounded-lg shadow-sm overflow-hidden">
<div className="col-span-2 row-span-1 shadow-sm overflow-hidden">
<CarouselDemo
paginationPosition="right"
paginationStyle="bar"
@ -46,7 +46,7 @@ const LearnPage = () => {
{/* 下三图 */}
{[3, 4, 5].map((i) => (
<div key={i} className="rounded-lg shadow-sm overflow-hidden">
<div key={i} className=" shadow-sm overflow-hidden">
<img
src={`/images/carousel-${i}.jpg`}
alt={`Image ${i}`}
@ -76,7 +76,7 @@ const LearnPage = () => {
<div className="w-[1590px] h-[285px] flex relative mb-10">
<div className="w-[750px] h-[188px] left-0 mt-25 absolute" style={{ backgroundColor: '#DEDEDC' }}>
<div
className="w-[169px] h-[240px] absolute left-0 bottom-0 bg-cover bg-center"
className="w-[140px] h-[220px] absolute left-4 bottom-2 bg-cover bg-center "
style={{ backgroundImage: "url('/public/images/book1.png')"}}
></div>
{/* 左边容器内容 */}
@ -89,10 +89,10 @@ const LearnPage = () => {
</div>
</div>
<div className="w-[750px] h-[188px] mt-25 right-0 absolute" style={{ backgroundColor: '#DEDEDC' }}>
<div
className="w-[169px] h-[240px] absolute left-0 bottom-0 bg-cover bg-center "
style={{ backgroundImage: "url('/public/images/book2.png')"}}
></div>
<img src="/public/images/book2.png"
className="w-[200px] h-[240px] absolute left-0 bottom-0 bg-cover bg-center "
alt="book"
></img>
{/* 右边容器内容 */}
<div className="absolute left-[200px] top-1/2 transform -translate-y-1/2 w-[520px] ">
<p className="text-[#005d93] text-[32px] font-bold text-center leading-tight mr-25"></p>