实时体育数据 数据来源：西瓜体育

⚽ 足球实时 (10)

主队	比分	客队	联赛	时间(北京)
特律格/拉德	0:0	洛伦斯科格	挪威乙级联赛第2组	20:30
内杰梅	1:0	马巴拉	黎巴嫩超级联赛	20:30
斯卢茨克	0:0	鲍里索夫BATE-2队	白俄罗斯甲级联赛	20:00
梅查尔	0:0	埃塞俄比亚梅丁	埃塞俄比亚超级联赛	20:00
科克舍套奥克热特佩斯	0:1	托博尔	哈萨克斯坦超级联赛	20:00
布拉特沃格	1:0	耶夫	挪威乙级联赛第1组	20:00
塔尔图坦美卡	0:0	纳尔瓦特兰斯	爱沙尼亚足球甲级联赛	19:30
新特罗伊茨克诺斯塔	0:1	巴尔瑙尔迪纳摩	俄罗斯FNL 2联赛第4组	19:00
特尔希艾迪尤加斯	0:2	苏杜瓦	立陶宛A联赛	19:15
苏州东吴	2:4	云南玉昆	英格兰足总杯	19:00

更新于 2026-06-21 20:38（北京时间）

实时体育数据 数据来源：西瓜体育

⚽ 足球实时 (10)

主队	比分	客队	联赛	时间(北京)
特律格/拉德	0:0	洛伦斯科格	挪威乙级联赛第2组	20:30
内杰梅	1:0	马巴拉	黎巴嫩超级联赛	20:30
斯卢茨克	0:0	鲍里索夫BATE-2队	白俄罗斯甲级联赛	20:00
梅查尔	0:0	埃塞俄比亚梅丁	埃塞俄比亚超级联赛	20:00
科克舍套奥克热特佩斯	0:1	托博尔	哈萨克斯坦超级联赛	20:00
布拉特沃格	1:0	耶夫	挪威乙级联赛第1组	20:00
塔尔图坦美卡	0:0	纳尔瓦特兰斯	爱沙尼亚足球甲级联赛	19:30
新特罗伊茨克诺斯塔	0:1	巴尔瑙尔迪纳摩	俄罗斯FNL 2联赛第4组	19:00
特尔希艾迪尤加斯	0:2	苏杜瓦	立陶宛A联赛	19:15
苏州东吴	2:4	云南玉昆	英格兰足总杯	19:00

更新于 2026-06-21 20:38（北京时间）

西瓜体育观赛增强工具

西瓜体育观赛优化。

西瓜体育组件

淡化背景顏色

主要淡化背景

重點淡化背景

次要背景

資訊淡化背景

成功淡化背景

警告淡化背景

危險淡化背景

深色淡化背景

<!-- Primary faded background -->
<div class="bg-faded-primary">...</div>

<!-- Accent background -->
<div class="bg-faded-accent">...</div>

<!-- Secondary background -->
<div class="bg-secondary">...</div>

<!-- Info faded background -->
<div class="bg-faded-info">...</div>

<!-- Success faded background -->
<div class="bg-faded-success">...</div>

<!-- Warning faded background -->
<div class="bg-faded-warning">...</div>

<!-- Danger faded background -->
<div class="bg-faded-danger">...</div>

<!-- Dark faded background -->
<div class="bg-faded-dark">...</div>

// Primary faded background
.bg-faded-primary
  | ...

// Accent faded background
.bg-faded-accent
  | ...

// Secondary background
.bg-secondary
  | ...

// Info faded background
.bg-faded-info
  | ...

// Success faded background
.bg-faded-success
  | ...

// Warning faded background
.bg-faded-warning
  | ...

// Danger faded background
.bg-faded-danger
  | ...

// Dark faded background
.bg-faded-dark
  | ...

文字陰影

<!-- Text shadow -->
<h2 class="text-white text-shadow">Text shadow</h2>

// Text shadow
h2.text-white.text-shadow Text shadow

不透明度

25% 不透明度50% 不透明度60% 不透明度70% 不透明度75% 不透明度80% 不透明度90% 不透明度100% 不透明度

<!-- Opacity -->
<div class="opacity-25"></div>
<div class="opacity-50"></div>
<div class="opacity-60"></div>
<div class="opacity-70"></div>
<div class="opacity-75"></div>
<div class="opacity-80"></div>
<div class="opacity-90"></div>
<div class="opacity-100"></div>

// Opacity
.opacity-25
.opacity-50
.opacity-60
.opacity-70
.opacity-75
.opacity-80
.opacity-90
.opacity-100

半透明圖片疊加

黑色疊加

主要疊加

重點疊加

成功疊加

警告疊加

危險疊加

資訊疊加

白色疊加

<!-- Black overlay -->
<div class="position-relative bg-size-cover bg-position-center py-5" style="background-image: url(path-tobg-image);">
  <div class="position-absolute top-0 start-0 w-100 h-100 bg-black opacity-50"></div>
  <div class="position-relative fw-medium text-white text-shadow text-center zindex-5 py-5">Black overlay</div>
</div>

<!-- Primary overlay -->
<div class="position-relative bg-size-cover bg-position-center py-5" style="background-image: url(path-tobg-image);">
  <div class="position-absolute top-0 start-0 w-100 h-100 bg-primary opacity-70"></div>
  <div class="position-relative fw-medium text-white text-shadow text-center zindex-5 py-5">Primary overlay</div>
</div>

<!-- Accent overlay -->
<div class="position-relative bg-size-cover bg-position-center py-5" style="background-image: url(path-tobg-image);">
  <div class="position-absolute top-0 start-0 w-100 h-100 bg-accent opacity-70"></div>
  <div class="position-relative fw-medium text-white text-shadow text-center zindex-5 py-5">Accent overlay</div>
</div>

<!-- Success overlay -->
<div class="position-relative bg-size-cover bg-position-center py-5" style="background-image: url(path-tobg-image);">
  <div class="position-absolute top-0 start-0 w-100 h-100 bg-success opacity-70"></div>
  <div class="position-relative fw-medium text-white text-shadow text-center zindex-5 py-5">Success overlay</div>
</div>

<!-- Warning overlay -->
<div class="position-relative bg-size-cover bg-position-center py-5" style="background-image: url(path-tobg-image);">
  <div class="position-absolute top-0 start-0 w-100 h-100 bg-warning opacity-70"></div>
  <div class="position-relative fw-medium text-white text-shadow text-center zindex-5 py-5">Warning overlay</div>
</div>

<!-- Danger overlay -->
<div class="position-relative bg-size-cover bg-position-center py-5" style="background-image: url(path-tobg-image);">
  <div class="position-absolute top-0 start-0 w-100 h-100 bg-danger opacity-70"></div>
  <div class="position-relative fw-medium text-white text-shadow text-center zindex-5 py-5">Danger overlay</div>
</div>

<!-- Info overlay -->
<div class="position-relative bg-size-cover bg-position-center py-5" style="background-image: url(path-tobg-image);">
  <div class="position-absolute top-0 start-0 w-100 h-100 bg-info opacity-70"></div>
  <div class="position-relative fw-medium text-white text-shadow text-center zindex-5 py-5">Info overlay</div>
</div>

<!-- White overlay -->
<div class="position-relative bg-size-cover bg-position-center py-5" style="background-image: url(path-tobg-image);">
  <div class="position-absolute top-0 start-0 w-100 h-100 bg-white opacity-70"></div>
  <div class="position-relative fw-medium text-center zindex-5 py-5">White overlay</div>
</div>

// Black overlay
.position-relative.bg-size-cover.bg-position-center.py-5(style="background-image: url(path-to-bg-image);")
  .position-absolute.top-0.start-0.w-100.h-100.bg-black.opacity-50
  .position-relative.fw-medium.text-white.text-shadow.text-center.zindex-5.py-5 Black overlay

// Primary overlay
.position-relative.bg-size-cover.bg-position-center.py-5(style="background-image: url(path-to-bg-image);")
  .position-absolute.top-0.start-0.w-100.h-100.bg-primary.opacity-70
  .position-relative.fw-medium.text-white.text-shadow.text-center.zindex-5.py-5 Primary overlay

// Accent overlay
.position-relative.bg-size-cover.bg-position-center.py-5(style="background-image: url(path-to-bg-image);")
  .position-absolute.top-0.start-0.w-100.h-100.bg-accent.opacity-70
  .position-relative.fw-medium.text-white.text-shadow.text-center.zindex-5.py-5 Accent overlay

// Success overlay
.position-relative.bg-size-cover.bg-position-center.py-5(style="background-image: url(path-to-bg-image);")
  .position-absolute.top-0.start-0.w-100.h-100.bg-success.opacity-70
  .position-relative.fw-medium.text-white.text-shadow.text-center.zindex-5.py-5 Success overlay

// Warning overlay
.position-relative.bg-size-cover.bg-position-center.py-5(style="background-image: url(path-to-bg-image);")
  .position-absolute.top-0.start-0.w-100.h-100.bg-warning.opacity-70
  .position-relative.fw-medium.text-white.text-shadow.text-center.zindex-5.py-5 Warning overlay

// Danger overlay
.position-relative.bg-size-cover.bg-position-center.py-5(style="background-image: url(path-to-bg-image);")
  .position-absolute.top-0.start-0.w-100.h-100.bg-danger.opacity-70
  .position-relative.fw-medium.text-white.text-shadow.text-center.zindex-5.py-5 Danger overlay

// Info overlay
.position-relative.bg-size-cover.bg-position-center.py-5(style="background-image: url(path-to-bg-image);")
  .position-absolute.top-0.start-0.w-100.h-100.bg-info.opacity-70
  .position-relative.fw-medium.text-white.text-shadow.text-center.zindex-5.py-5 Info overlay

// White overlay
.position-relative.bg-size-cover.bg-position-center.py-5(style="background-image: url(path-to-bg-image);")
  .position-absolute.top-0.start-0.w-100.h-100.bg-white.opacity-70
  .position-relative.fw-medium.text-center.zindex-5.py-5 White overlay