qiuchenfan
/
news
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

无圆角

This commit is contained in:
qiuchenfan 2025-11-20 10:24:53 +08:00
parent 976f6708ec
commit eb87de7d5a
1 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
app/components/news/body/ImageGridSection.tsx
View File

@ -23,12 +23,12 @@ const LearnPage = () => {
</div> </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="lg:w-3/5 overflow-hidden">
<div className="grid grid-cols-3 grid-rows-2 gap-3 h-full w-full"> <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 <img
src="/images/carousel-1.jpg" src="/images/carousel-1.jpg"
alt="Image 1" alt="Image 1"
@ -37,7 +37,7 @@ const LearnPage = () => {
</div> </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 <CarouselDemo
paginationPosition="right" paginationPosition="right"
paginationStyle="bar" paginationStyle="bar"
@ -46,7 +46,7 @@ const LearnPage = () => {
{/* 下三图 */} {/* 下三图 */}
{[3, 4, 5].map((i) => ( {[3, 4, 5].map((i) => (
<div key={i} className="rounded-lg shadow-sm overflow-hidden"> <div key={i} className=" shadow-sm overflow-hidden">
<img <img
src={`/images/carousel-${i}.jpg`} src={`/images/carousel-${i}.jpg`}
alt={`Image ${i}`} alt={`Image ${i}`}
@ -76,7 +76,7 @@ const LearnPage = () => {
<div className="w-[1590px] h-[285px] flex relative mb-10"> <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-[750px] h-[188px] left-0 mt-25 absolute" style={{ backgroundColor: '#DEDEDC' }}>
<div <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')"}} style={{ backgroundImage: "url('/public/images/book1.png')"}}
></div> ></div>
{/* 左边容器内容 */} {/* 左边容器内容 */}
@ -89,10 +89,10 @@ const LearnPage = () => {
</div> </div>
</div> </div>
<div className="w-[750px] h-[188px] mt-25 right-0 absolute" style={{ backgroundColor: '#DEDEDC' }}> <div className="w-[750px] h-[188px] mt-25 right-0 absolute" style={{ backgroundColor: '#DEDEDC' }}>
<div <img src="/public/images/book2.png"
className="w-[169px] h-[240px] absolute left-0 bottom-0 bg-cover bg-center " className="w-[200px] h-[240px] absolute left-0 bottom-0 bg-cover bg-center "
style={{ backgroundImage: "url('/public/images/book2.png')"}} alt="book"
></div> ></img>
{/* 右边容器内容 */} {/* 右边容器内容 */}
<div className="absolute left-[200px] top-1/2 transform -translate-y-1/2 w-[520px] "> <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> <p className="text-[#005d93] text-[32px] font-bold text-center leading-tight mr-25">习近平著作选读</p>