607 lines
31 KiB
HTML
607 lines
31 KiB
HTML
|
||
<!DOCTYPE html>
|
||
<html lang="zh-CN" data-theme="dark">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>太空旅行：从星辰大海到数字宇宙</title>
|
||
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.4.19/dist/full.min.css" rel="stylesheet" type="text/css" />
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||
<style>
|
||
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&display=swap');
|
||
|
||
body {
|
||
background: linear-gradient(135deg, #0f0c29 0%, #302b63 50%, #24243e 100%);
|
||
font-family: 'Orbitron', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||
}
|
||
|
||
.hero-title {
|
||
background: linear-gradient(45deg, #00ffff, #ff00ff, #ffff00);
|
||
-webkit-background-clip: text;
|
||
background-clip: text;
|
||
-webkit-text-fill-color: transparent;
|
||
animation: gradient 3s ease infinite;
|
||
font-weight: 900;
|
||
}
|
||
|
||
@keyframes gradient {
|
||
0%, 100% { filter: hue-rotate(0deg); }
|
||
50% { filter: hue-rotate(180deg); }
|
||
}
|
||
|
||
.glass-card {
|
||
background: rgba(255, 255, 255, 0.05);
|
||
backdrop-filter: blur(10px);
|
||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||
transition: all 0.3s ease;
|
||
}
|
||
|
||
.glass-card:hover {
|
||
background: rgba(255, 255, 255, 0.08);
|
||
transform: translateY(-2px);
|
||
box-shadow: 0 10px 30px rgba(0, 255, 255, 0.2);
|
||
}
|
||
|
||
.timeline-dot {
|
||
animation: pulse 2s infinite;
|
||
}
|
||
|
||
@keyframes pulse {
|
||
0% { box-shadow: 0 0 0 0 rgba(0, 255, 255, 0.7); }
|
||
70% { box-shadow: 0 0 0 10px rgba(0, 255, 255, 0); }
|
||
100% { box-shadow: 0 0 0 0 rgba(0, 255, 255, 0); }
|
||
}
|
||
|
||
.tech-card {
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.tech-card::before {
|
||
content: '';
|
||
position: absolute;
|
||
top: -2px;
|
||
left: -2px;
|
||
right: -2px;
|
||
bottom: -2px;
|
||
background: linear-gradient(45deg, #00ffff, #ff00ff, #ffff00, #00ffff);
|
||
border-radius: inherit;
|
||
opacity: 0;
|
||
transition: opacity 0.3s;
|
||
z-index: -1;
|
||
}
|
||
|
||
.tech-card:hover::before {
|
||
opacity: 1;
|
||
animation: rotate 2s linear infinite;
|
||
}
|
||
|
||
@keyframes rotate {
|
||
0% { transform: rotate(0deg); }
|
||
100% { transform: rotate(360deg); }
|
||
}
|
||
|
||
.table-container {
|
||
overflow-x: auto;
|
||
scrollbar-width: thin;
|
||
scrollbar-color: #00ffff #1a1a2e;
|
||
}
|
||
|
||
.table-container::-webkit-scrollbar {
|
||
height: 8px;
|
||
}
|
||
|
||
.table-container::-webkit-scrollbar-track {
|
||
background: #1a1a2e;
|
||
}
|
||
|
||
.table-container::-webkit-scrollbar-thumb {
|
||
background: linear-gradient(45deg, #00ffff, #ff00ff);
|
||
border-radius: 4px;
|
||
}
|
||
|
||
.neon-text {
|
||
text-shadow: 0 0 10px currentColor;
|
||
}
|
||
|
||
.float-animation {
|
||
animation: float 3s ease-in-out infinite;
|
||
}
|
||
|
||
@keyframes float {
|
||
0%, 100% { transform: translateY(0px); }
|
||
50% { transform: translateY(-10px); }
|
||
}
|
||
</style>
|
||
</head>
|
||
<body class="min-h-screen text-gray-100">
|
||
<!-- Hero Section -->
|
||
<section class="relative min-h-screen flex items-center justify-center overflow-hidden">
|
||
<div class="absolute inset-0">
|
||
<div class="absolute top-20 left-20 w-72 h-72 bg-purple-500 rounded-full mix-blend-multiply filter blur-xl opacity-20 animate-blob"></div>
|
||
<div class="absolute top-40 right-20 w-72 h-72 bg-yellow-500 rounded-full mix-blend-multiply filter blur-xl opacity-20 animate-blob animation-delay-2000"></div>
|
||
<div class="absolute -bottom-8 left-40 w-72 h-72 bg-pink-500 rounded-full mix-blend-multiply filter blur-xl opacity-20 animate-blob animation-delay-4000"></div>
|
||
</div>
|
||
|
||
<div class="relative z-10 text-center px-6">
|
||
<h1 class="hero-title text-6xl md:text-8xl mb-6 float-animation">太空旅行</h1>
|
||
<p class="text-2xl md:text-3xl text-cyan-300 mb-4">从星辰大海到数字宇宙</p>
|
||
<p class="text-lg md:text-xl text-gray-300 max-w-3xl mx-auto">
|
||
产业变革：从载人航天旅游到AI驱动的太空算力中心
|
||
</p>
|
||
<div class="mt-8 flex gap-4 justify-center">
|
||
<span class="badge badge-info badge-lg">AI算力上太空</span>
|
||
<span class="badge badge-success badge-lg">万亿级市场</span>
|
||
<span class="badge badge-warning badge-lg">新基建革命</span>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 核心概念 -->
|
||
<section class="py-16 px-6">
|
||
<div class="max-w-7xl mx-auto">
|
||
<h2 class="text-4xl font-bold text-center mb-12 neon-text text-cyan-300">
|
||
<i class="fas fa-rocket mr-3"></i>概念核心逻辑
|
||
</h2>
|
||
|
||
<div class="grid md:grid-cols-3 gap-6">
|
||
<div class="glass-card rounded-2xl p-6 tech-card">
|
||
<div class="text-5xl mb-4 text-center">⚡</div>
|
||
<h3 class="text-xl font-bold mb-3 text-yellow-300">能源革命</h3>
|
||
<p class="text-sm text-gray-300">
|
||
太空数据中心PUE接近1，太阳能年发电时长超8000小时，能源成本降低10倍以上。地面能源瓶颈催生太空算力需求。
|
||
</p>
|
||
<div class="mt-4 stats stats-vertical w-full bg-black/30">
|
||
<div class="stat">
|
||
<div class="stat-value text-cyan-300">1</div>
|
||
<div class="stat-title text-xs">理想PUE值</div>
|
||
</div>
|
||
<div class="stat">
|
||
<div class="stat-value text-green-300">8000+</div>
|
||
<div class="stat-title text-xs">年发电小时</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="glass-card rounded-2xl p-6 tech-card">
|
||
<div class="text-5xl mb-4 text-center">🚀</div>
|
||
<h3 class="text-xl font-bold mb-3 text-pink-300">技术突破</h3>
|
||
<p class="text-sm text-gray-300">
|
||
SpaceX星舰将发射成本降至1000元/公斤，激光通信、抗辐射芯片、空间太阳能技术成熟，为大规模部署奠定基础。
|
||
</p>
|
||
<div class="mt-4 flex flex-wrap gap-2">
|
||
<span class="badge badge-outline badge-sm">激光通信</span>
|
||
<span class="badge badge-outline badge-sm">钙钛矿电池</span>
|
||
<span class="badge badge-outline badge-sm">抗辐射芯片</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="glass-card rounded-2xl p-6 tech-card">
|
||
<div class="text-5xl mb-4 text-center">🌍</div>
|
||
<h3 class="text-xl font-bold mb-3 text-purple-300">大国博弈</h3>
|
||
<p class="text-sm text-gray-300">
|
||
太空成为大国竞争新高地，中美加速布局，"逐日工程"、"三体星座"等国家级项目抢占产业制高点。
|
||
</p>
|
||
<div class="mt-4 timeline">
|
||
<div class="flex items-center gap-3">
|
||
<div class="timeline-dot w-3 h-3 bg-red-500 rounded-full"></div>
|
||
<span class="text-xs">美国：SpaceX/亚马逊/谷歌三巨头布局</span>
|
||
</div>
|
||
<div class="flex items-center gap-3 mt-2">
|
||
<div class="timeline-dot w-3 h-3 bg-yellow-500 rounded-full"></div>
|
||
<span class="text-xs">中国：星算计划/三体星座/逐日工程</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 关键事件时间轴 -->
|
||
<section class="py-16 px-6 bg-black/20">
|
||
<div class="max-w-7xl mx-auto">
|
||
<h2 class="text-4xl font-bold text-center mb-12 neon-text text-green-300">
|
||
<i class="fas fa-clock mr-3"></i>关键事件时间轴
|
||
</h2>
|
||
|
||
<div class="relative">
|
||
<div class="absolute left-1/2 transform -translate-x-1/2 h-full w-0.5 bg-gradient-to-b from-cyan-500 to-purple-500"></div>
|
||
|
||
<div class="space-y-12">
|
||
<div class="flex items-center">
|
||
<div class="w-full md:w-1/2 pr-8 text-right">
|
||
<div class="glass-card rounded-xl p-4 inline-block">
|
||
<h3 class="font-bold text-yellow-300">2025年5月14日</h3>
|
||
<p class="text-sm mt-1">中国成功发射"三体计算星座"首批12颗卫星</p>
|
||
<p class="text-xs text-gray-400 mt-2">全球首个在轨组网的太空计算卫星星座</p>
|
||
</div>
|
||
</div>
|
||
<div class="absolute left-1/2 transform -translate-x-1/2 w-4 h-4 bg-cyan-500 rounded-full border-4 border-gray-900"></div>
|
||
<div class="w-full md:w-1/2 pl-8"></div>
|
||
</div>
|
||
|
||
<div class="flex items-center">
|
||
<div class="w-full md:w-1/2 pr-8"></div>
|
||
<div class="absolute left-1/2 transform -translate-x-1/2 w-4 h-4 bg-purple-500 rounded-full border-4 border-gray-900"></div>
|
||
<div class="w-full md:w-1/2 pl-8">
|
||
<div class="glass-card rounded-xl p-4 inline-block">
|
||
<h3 class="font-bold text-pink-300">2025年10-11月</h3>
|
||
<p class="text-sm mt-1">科技巨头密集发布太空AI计划</p>
|
||
<p class="text-xs text-gray-400 mt-2">马斯克、贝索斯、谷歌连续表态，引爆市场</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex items-center">
|
||
<div class="w-full md:w-1/2 pr-8 text-right">
|
||
<div class="glass-card rounded-xl p-4 inline-block">
|
||
<h3 class="font-bold text-green-300">2027年目标</h3>
|
||
<p class="text-sm mt-1">谷歌计划发射TPU卫星集群</p>
|
||
<p class="text-xs text-gray-400 mt-2">"捕光者计划"81颗AI卫星组成</p>
|
||
</div>
|
||
</div>
|
||
<div class="absolute left-1/2 transform -translate-x-1/2 w-4 h-4 bg-yellow-500 rounded-full border-4 border-gray-900"></div>
|
||
<div class="w-full md:w-1/2 pl-8"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 产业链图谱 -->
|
||
<section class="py-16 px-6">
|
||
<div class="max-w-7xl mx-auto">
|
||
<h2 class="text-4xl font-bold text-center mb-12 neon-text text-purple-300">
|
||
<i class="fas fa-network-wired mr-3"></i>产业链图谱
|
||
</h2>
|
||
|
||
<div class="grid md:grid-cols-3 gap-6">
|
||
<!-- 上游 -->
|
||
<div class="glass-card rounded-2xl p-6">
|
||
<h3 class="text-2xl font-bold mb-4 text-center text-cyan-300">
|
||
<i class="fas fa-atom mr-2"></i>上游
|
||
</h3>
|
||
<div class="space-y-3">
|
||
<div class="collapse collapse-arrow bg-black/30">
|
||
<input type="checkbox" checked />
|
||
<div class="collapse-title text-sm font-medium">能源材料</div>
|
||
<div class="collapse-content">
|
||
<ul class="text-xs space-y-1">
|
||
<li>• 砷化镓/钙钛矿（乾照光电）</li>
|
||
<li>• 特种纤维（隆华新材、凯盛新材）</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="collapse collapse-arrow bg-black/30">
|
||
<input type="checkbox" />
|
||
<div class="collapse-title text-sm font-medium">核心元器件</div>
|
||
<div class="collapse-content">
|
||
<ul class="text-xs space-y-1">
|
||
<li>• 抗辐射芯片（复旦微电）</li>
|
||
<li>• 存储芯片（江波龙）</li>
|
||
<li>• 激光模块（光库科技）</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 中游 -->
|
||
<div class="glass-card rounded-2xl p-6">
|
||
<h3 class="text-2xl font-bold mb-4 text-center text-yellow-300">
|
||
<i class="fas fa-industry mr-2"></i>中游
|
||
</h3>
|
||
<div class="space-y-3">
|
||
<div class="collapse collapse-arrow bg-black/30">
|
||
<input type="checkbox" checked />
|
||
<div class="collapse-title text-sm font-medium">卫星平台与总装</div>
|
||
<div class="collapse-content">
|
||
<ul class="text-xs space-y-1">
|
||
<li>• 中国卫星、航天电子</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="collapse collapse-arrow bg-black/30">
|
||
<input type="checkbox" />
|
||
<div class="collapse-title text-sm font-medium">能源系统</div>
|
||
<div class="collapse-content">
|
||
<ul class="text-xs space-y-1">
|
||
<li>• 上海港湾（核心）</li>
|
||
<li>• 电科蓝天</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="collapse collapse-arrow bg-black/30">
|
||
<input type="checkbox" />
|
||
<div class="collapse-title text-sm font-medium">通信载荷</div>
|
||
<div class="collapse-content">
|
||
<ul class="text-xs space-y-1">
|
||
<li>• 烽火通信、上海瀚讯</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 下游 -->
|
||
<div class="glass-card rounded-2xl p-6">
|
||
<h3 class="text-2xl font-bold mb-4 text-center text-pink-300">
|
||
<i class="fas fa-satellite mr-2"></i>下游
|
||
</h3>
|
||
<div class="space-y-3">
|
||
<div class="collapse collapse-arrow bg-black/30">
|
||
<input type="checkbox" checked />
|
||
<div class="collapse-title text-sm font-medium">算力服务</div>
|
||
<div class="collapse-content">
|
||
<ul class="text-xs space-y-1">
|
||
<li>• 普天科技</li>
|
||
<li>• 国星宇航（星算计划）</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="collapse collapse-arrow bg-black/30">
|
||
<input type="checkbox" />
|
||
<div class="collapse-title text-sm font-medium">太空旅游</div>
|
||
<div class="collapse-content">
|
||
<ul class="text-xs space-y-1">
|
||
<li>• 航宇微（与中科宇航合作）</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="collapse collapse-arrow bg-black/30">
|
||
<input type="checkbox" />
|
||
<div class="collapse-title text-sm font-medium">发射服务</div>
|
||
<div class="collapse-content">
|
||
<ul class="text-xs space-y-1">
|
||
<li>• 高华科技、斯瑞新材</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 核心标的表格 -->
|
||
<section class="py-16 px-6 bg-black/20">
|
||
<div class="max-w-7xl mx-auto">
|
||
<h2 class="text-4xl font-bold text-center mb-12 neon-text text-yellow-300">
|
||
<i class="fas fa-chart-line mr-3"></i>核心上市公司
|
||
</h2>
|
||
|
||
<div class="table-container">
|
||
<table class="w-full text-sm">
|
||
<thead>
|
||
<tr class="border-b border-cyan-500/30">
|
||
<th class="p-4 text-left text-cyan-300">股票名称</th>
|
||
<th class="p-4 text-left text-cyan-300">分类</th>
|
||
<th class="p-4 text-left text-cyan-300">相关性</th>
|
||
<th class="p-4 text-left text-cyan-300">消息来源</th>
|
||
<th class="p-4 text-left text-cyan-300">投资逻辑</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr class="border-b border-gray-700/30 hover:bg-white/5 transition">
|
||
<td class="p-4 font-medium text-yellow-300">探路者</td>
|
||
<td class="p-4"><span class="badge badge-info">宇航服</span></td>
|
||
<td class="p-4">为神十二至神二十航天员开发舱内服装，参与标准制定</td>
|
||
<td class="p-4 text-xs text-gray-400">互动平台</td>
|
||
<td class="p-4 text-xs">国家队配套，订单确定性高</td>
|
||
</tr>
|
||
<tr class="border-b border-gray-700/30 hover:bg-white/5 transition">
|
||
<td class="p-4 font-medium text-green-300">上海港湾</td>
|
||
<td class="p-4"><span class="badge badge-success">太阳翼</span></td>
|
||
<td class="p-4">全系太阳翼/能源系统，方正研报重点推荐</td>
|
||
<td class="p-4 text-xs text-gray-400">券商研报</td>
|
||
<td class="p-4 text-xs">太空算力核心增量，万亿市场空间</td>
|
||
</tr>
|
||
<tr class="border-b border-gray-700/30 hover:bg-white/5 transition">
|
||
<td class="p-4 font-medium text-purple-300">乾照光电</td>
|
||
<td class="p-4"><span class="badge badge-warning">砷化镓</span></td>
|
||
<td class="p-4">砷化镓外延片，空间太阳能电池核心材料</td>
|
||
<td class="p-4 text-xs text-gray-400">券商研报</td>
|
||
<td class="p-4 text-xs">高价值量，技术壁垒高</td>
|
||
</tr>
|
||
<tr class="border-b border-gray-700/30 hover:bg-white/5 transition">
|
||
<td class="p-4 font-medium text-pink-300">国星宇航</td>
|
||
<td class="p-4"><span class="badge badge-error">太空算力</span></td>
|
||
<td class="p-4">星算计划，三体计算星座已部署12颗卫星</td>
|
||
<td class="p-4 text-xs text-gray-400">项目进展</td>
|
||
<td class="p-4 text-xs">国内太空算力领跑者，商业化进行中</td>
|
||
</tr>
|
||
<tr class="border-b border-gray-700/30 hover:bg-white/5 transition">
|
||
<td class="p-4 font-medium text-cyan-300">烽火通信</td>
|
||
<td class="p-4"><span class="badge badge-primary">激光通信</span></td>
|
||
<td class="p-4">星间激光通信，天基网络核心环节</td>
|
||
<td class="p-4 text-xs text-gray-400">券商研报</td>
|
||
<td class="p-4 text-xs">算力上天必要条件，Tbps级需求</td>
|
||
</tr>
|
||
<tr class="border-b border-gray-700/30 hover:bg-white/5 transition">
|
||
<td class="p-4 font-medium text-orange-300">际华集团</td>
|
||
<td class="p-4"><span class="badge badge-secondary">太空靴</span></td>
|
||
<td class="p-4">参与研制神五至神十二宇航员出舱靴系列</td>
|
||
<td class="p-4 text-xs text-gray-400">互动平台</td>
|
||
<td class="p-4 text-xs">航天装备龙头，多代产品供应</td>
|
||
</tr>
|
||
<tr class="border-b border-gray-700/30 hover:bg-white/5 transition">
|
||
<td class="p-4 font-medium text-red-300">航宇微</td>
|
||
<td class="p-4"><span class="badge badge-accent">商业运营</span></td>
|
||
<td class="p-4">与中科宇航合作开发太空旅游项目</td>
|
||
<td class="p-4 text-xs text-gray-400">公开资料</td>
|
||
<td class="p-4 text-xs">直接受益太空旅游产业化</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 风险与机遇 -->
|
||
<section class="py-16 px-6">
|
||
<div class="max-w-7xl mx-auto">
|
||
<h2 class="text-4xl font-bold text-center mb-12 neon-text text-green-300">
|
||
<i class="fas fa-balance-scale mr-3"></i>风险与机遇
|
||
</h2>
|
||
|
||
<div class="grid md:grid-cols-2 gap-6">
|
||
<div class="glass-card rounded-2xl p-6">
|
||
<h3 class="text-2xl font-bold mb-4 text-red-300">
|
||
<i class="fas fa-exclamation-triangle mr-2"></i>潜在风险
|
||
</h3>
|
||
<div class="space-y-4">
|
||
<div class="flex items-start gap-3">
|
||
<div class="w-8 h-8 bg-red-500/20 rounded-full flex items-center justify-center flex-shrink-0">
|
||
<i class="fas fa-bolt text-red-400 text-xs"></i>
|
||
</div>
|
||
<div>
|
||
<h4 class="font-semibold text-sm">技术风险</h4>
|
||
<p class="text-xs text-gray-400 mt-1">抗辐射芯片性能、激光通信成熟度等关键技术瓶颈</p>
|
||
</div>
|
||
</div>
|
||
<div class="flex items-start gap-3">
|
||
<div class="w-8 h-8 bg-orange-500/20 rounded-full flex items-center justify-center flex-shrink-0">
|
||
<i class="fas fa-coins text-orange-400 text-xs"></i>
|
||
</div>
|
||
<div>
|
||
<h4 class="font-semibold text-sm">商业化风险</h4>
|
||
<p class="text-xs text-gray-400 mt-1">成本高昂，一座算力中心发射成本超200亿元</p>
|
||
</div>
|
||
</div>
|
||
<div class="flex items-start gap-3">
|
||
<div class="w-8 h-8 bg-yellow-500/20 rounded-full flex items-center justify-center flex-shrink-0">
|
||
<i class="fas fa-globe text-yellow-400 text-xs"></i>
|
||
</div>
|
||
<div>
|
||
<h4 class="font-semibold text-sm">政策风险</h4>
|
||
<p class="text-xs text-gray-400 mt-1">地缘政治、国际监管、频谱资源竞争</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="glass-card rounded-2xl p-6">
|
||
<h3 class="text-2xl font-bold mb-4 text-green-300">
|
||
<i class="fas fa-rocket mr-2"></i>投资机遇
|
||
</h3>
|
||
<div class="space-y-4">
|
||
<div class="flex items-start gap-3">
|
||
<div class="w-8 h-8 bg-green-500/20 rounded-full flex items-center justify-center flex-shrink-0">
|
||
<i class="fas fa-sun text-green-400 text-xs"></i>
|
||
</div>
|
||
<div>
|
||
<h4 class="font-semibold text-sm">能源革命</h4>
|
||
<p class="text-xs text-gray-400 mt-1">太阳翼系统价值量巨大，TW级需求超万亿市场</p>
|
||
</div>
|
||
</div>
|
||
<div class="flex items-start gap-3">
|
||
<div class="w-8 h-8 bg-cyan-500/20 rounded-full flex items-center justify-center flex-shrink-0">
|
||
<i class="fas fa-network-wired text-cyan-400 text-xs"></i>
|
||
</div>
|
||
<div>
|
||
<h4 class="font-semibold text-sm">天基网络</h4>
|
||
<p class="text-xs text-gray-400 mt-1">激光通信是算力上天必要条件，先发优势明显</p>
|
||
</div>
|
||
</div>
|
||
<div class="flex items-start gap-3">
|
||
<div class="w-8 h-8 bg-purple-500/20 rounded-full flex items-center justify-center flex-shrink-0">
|
||
<i class="fas fa-microchip text-purple-400 text-xs"></i>
|
||
</div>
|
||
<div>
|
||
<h4 class="font-semibold text-sm">国产替代</h4>
|
||
<p class="text-xs text-gray-400 mt-1">抗辐射芯片、存储等核心器件迫切需要自主可控</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 投资建议 -->
|
||
<section class="py-16 px-6 bg-gradient-to-b from-transparent to-black/50">
|
||
<div class="max-w-4xl mx-auto text-center">
|
||
<h2 class="text-4xl font-bold mb-6 neon-text text-yellow-300">
|
||
<i class="fas fa-lightbulb mr-3"></i>投资策略
|
||
</h2>
|
||
<div class="glass-card rounded-2xl p-8">
|
||
<p class="text-lg mb-6 text-gray-200">
|
||
当前"太空旅行"概念呈现双轨并行格局，建议采取"卖水人"策略
|
||
</p>
|
||
|
||
<div class="grid md:grid-cols-2 gap-6 text-left">
|
||
<div class="bg-gradient-to-br from-cyan-500/10 to-purple-500/10 rounded-xl p-4">
|
||
<h3 class="font-bold text-cyan-300 mb-2">优先布局方向</h3>
|
||
<ul class="text-sm space-y-1 text-gray-300">
|
||
<li>📈 空间能源系统（上海港湾）</li>
|
||
<li>📡 激光通信（光库科技、烽火通信）</li>
|
||
<li>💾 抗辐射芯片（复旦微电）</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="bg-gradient-to-br from-green-500/10 to-yellow-500/10 rounded-xl p-4">
|
||
<h3 class="font-bold text-green-300 mb-2">跟踪验证指标</h3>
|
||
<ul class="text-sm space-y-1 text-gray-300">
|
||
<li>🚀 发射成本下降曲线</li>
|
||
<li>📊 在轨算力与通信速率</li>
|
||
<li>💰 关键公司太空业务订单</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mt-8 p-4 bg-red-500/10 rounded-xl border border-red-500/30">
|
||
<p class="text-sm text-yellow-300">
|
||
⚠️ 风险提示：警惕概念炒作与实际业务贡献度的巨大鸿沟
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Footer -->
|
||
<footer class="py-8 px-6 border-t border-gray-800">
|
||
<div class="max-w-7xl mx-auto text-center text-sm text-gray-400">
|
||
<p>数据来源：公开新闻、券商研报、公司公告</p>
|
||
<p class="mt-2">投资有风险，入市需谨慎</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<script>
|
||
// 添加平滑滚动效果
|
||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||
anchor.addEventListener('click', function (e) {
|
||
e.preventDefault();
|
||
const target = document.querySelector(this.getAttribute('href'));
|
||
if (target) {
|
||
target.scrollIntoView({ behavior: 'smooth' });
|
||
}
|
||
});
|
||
});
|
||
|
||
// 动态加载动画
|
||
const observerOptions = {
|
||
threshold: 0.1,
|
||
rootMargin: '0px 0px -50px 0px'
|
||
};
|
||
|
||
const observer = new IntersectionObserver((entries) => {
|
||
entries.forEach(entry => {
|
||
if (entry.isIntersecting) {
|
||
entry.target.style.opacity = '0';
|
||
entry.target.style.transform = 'translateY(20px)';
|
||
setTimeout(() => {
|
||
entry.target.style.transition = 'all 0.6s ease';
|
||
entry.target.style.opacity = '1';
|
||
entry.target.style.transform = 'translateY(0)';
|
||
}, 100);
|
||
}
|
||
});
|
||
}, observerOptions);
|
||
|
||
document.querySelectorAll('section').forEach(section => {
|
||
observer.observe(section);
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |