This commit is contained in:
Li1304553726 2025-11-20 11:22:58 +08:00
commit be92a9cda9
3 changed files with 14 additions and 16 deletions

View File

@ -125,8 +125,7 @@ export function CarouselDemo({
{/* 分页指示器容器:绝对定位在底部 */}
<div
className={`absolute bottom-4 ${
paginationPosition === 'left' ? 'left-4' : 'right-4' // 根据 prop 控制左右位置
className={`absolute bottom-4 ${paginationPosition === 'left' ? 'left-4' : 'right-4' // 根据 prop 控制左右位置
} flex gap-2 z-10`} // 水平排列,间距 0.5rem,置于轮播图上方
>
{/* 动态生成指示器按钮 */}
@ -138,9 +137,8 @@ export function CarouselDemo({
// 根据 paginationStyle 决定形状
paginationStyle === 'dot'
? 'h-2 w-2 rounded-full' // 圆形:宽高相等 + 全圆角
: 'h-2 w-8 rounded' // 块状:宽 2rem高 0.5rem,带圆角
} ${
index === current
: 'h-1 w-6 rounded' // 块状
} ${index === current
? 'bg-white' // 当前项为纯白色
: 'bg-white/50' // 非当前项为半透明白色
}`}

View File

@ -45,7 +45,7 @@ const LearnPage = () => {
</div>
{/* 下三图 */}
{[3, 4, 5].map((i) => (
{[3, 4, 6].map((i) => (
<div key={i} className=" shadow-sm overflow-hidden">
<img
src={`/images/carousel-${i}.jpg`}
@ -59,7 +59,7 @@ const LearnPage = () => {
{/* 右侧新闻列表 */}
<div className="lg:w-2/5 bg-white border border-gray-200 rounded-lg shadow-sm p-4 flex items-center">
<div className="lg:w-2/5 bg-white border border-gray-200 shadow-sm p-8 flex items-center">
<ul className="space-y-8 w-full">
{newsList.map((item, index) => (
<li
@ -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-[140px] h-[220px] absolute left-4 bottom-2 bg-cover bg-center "
className="w-[140px] h-[220px] absolute left-4 bottom-3 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' }}>
<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="w-[150px] h-[240px] absolute left-5 bottom-0 bg-cover bg-center "
style={{ backgroundImage: "url('/public/images/book2.png')"}}
></div>
{/* 右边容器内容 */}
<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>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 57 KiB

After

Width:  |  Height:  |  Size: 141 KiB