393 lines
23 KiB
HTML
393 lines
23 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>AWS云服务专家 - 产品服务</title>
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
|
||
<link rel="stylesheet" href="src/css/styles.css">
|
||
<style>
|
||
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap');
|
||
body {
|
||
font-family: 'Roboto', sans-serif;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body class="bg-white">
|
||
<!-- 导航栏 -->
|
||
<nav class="bg-[#232F3E] shadow-md fixed w-full z-50">
|
||
<div class="container mx-auto px-4 py-4">
|
||
<div class="flex items-center justify-between">
|
||
<a href="index.html" class="flex items-center text-white">
|
||
<i class="fas fa-cloud text-2xl mr-2"></i>
|
||
<span class="text-xl font-bold">云服务专家</span>
|
||
</a>
|
||
<!-- 移动端菜单按钮 -->
|
||
<button class="md:hidden text-white mobile-menu-button" aria-label="打开菜单">
|
||
<i class="fas fa-bars text-2xl"></i>
|
||
</button>
|
||
<!-- 桌面端导航 -->
|
||
<div class="hidden md:flex space-x-6">
|
||
<a href="index.html" class="text-white/85 hover:text-gray-300">首页</a>
|
||
<a href="products.html" class="text-white hover:text-gray-300">AWS产品</a>
|
||
<a href="solutions.html" class="text-white/85 hover:text-gray-300">解决方案</a>
|
||
<a href="cases.html" class="text-white/85 hover:text-gray-300">客户案例</a>
|
||
<a href="about.html" class="text-white/85 hover:text-gray-300">关于我们</a>
|
||
<a href="contact.html" class="text-white/85 hover:text-gray-300">联系我们</a>
|
||
</div>
|
||
</div>
|
||
<!-- 移动端菜单 -->
|
||
<div class="md:hidden hidden mobile-menu">
|
||
<div class="flex flex-col space-y-4 mt-4">
|
||
<a href="index.html" class="text-white hover:text-gray-300">首页</a>
|
||
<a href="products.html" class="text-white hover:text-gray-300">AWS产品</a>
|
||
<a href="solutions.html" class="text-white/85 hover:text-gray-300">解决方案</a>
|
||
<a href="cases.html" class="text-white/85 hover:text-gray-300">客户案例</a>
|
||
<a href="about.html" class="text-white/85 hover:text-gray-300">关于我们</a>
|
||
<a href="contact.html" class="text-white/85 hover:text-gray-300">联系我们</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- 页面标题 -->
|
||
<section class="relative bg-gradient-to-b from-[#232F3E]/80 to-[#232F3E]/90 text-white py-24 md:py-32">
|
||
<div class="container mx-auto px-4 text-center">
|
||
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 leading-tight">AWS产品服务</h1>
|
||
<p class="text-xl md:text-2xl text-white/90 mb-8 leading-relaxed">全面的AWS云服务产品线，满足您的各种业务需求</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 计算服务 -->
|
||
<section class="section">
|
||
<div class="container">
|
||
<div class="max-w-4xl mx-auto text-center mb-16">
|
||
<h2 class="text-4xl font-bold text-[#333333] mb-4">计算服务</h2>
|
||
<p class="text-xl text-gray-600 leading-relaxed">灵活、可扩展的计算能力，支持各种工作负载</p>
|
||
</div>
|
||
|
||
<div class="grid md:grid-cols-3 gap-8">
|
||
<div class="bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1">
|
||
<div class="h-48 bg-gradient-to-br from-[#FF9900]/20 to-[#FF9900]/10 flex items-center justify-center">
|
||
<i class="fas fa-server text-6xl text-[#FF9900]"></i>
|
||
</div>
|
||
<div class="p-8">
|
||
<h3 class="text-2xl font-semibold mb-4">EC2 云服务器</h3>
|
||
<p class="text-gray-600 leading-relaxed mb-4">可扩展的计算能力，适用于各种工作负载，从小型网站到企业级应用</p>
|
||
<ul class="space-y-2 mb-6">
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">多种实例类型选择</span>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">按需付费模式</span>
|
||
</li>
|
||
</ul>
|
||
<a href="#" class="inline-flex items-center text-[#FF9900] hover:text-[#FF9900]/90">
|
||
了解详情
|
||
<i class="fas fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1">
|
||
<div class="h-48 bg-gradient-to-br from-[#FF9900]/20 to-[#FF9900]/10 flex items-center justify-center">
|
||
<i class="fas fa-cube text-6xl text-[#FF9900]"></i>
|
||
</div>
|
||
<div class="p-8">
|
||
<h3 class="text-2xl font-semibold mb-4">ECS 容器服务</h3>
|
||
<p class="text-gray-600 leading-relaxed mb-4">高度可扩展的容器管理服务，支持Docker容器部署和管理</p>
|
||
<ul class="space-y-2 mb-6">
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">完全托管的容器服务</span>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">自动扩展和负载均衡</span>
|
||
</li>
|
||
</ul>
|
||
<a href="#" class="inline-flex items-center text-[#FF9900] hover:text-[#FF9900]/90">
|
||
了解详情
|
||
<i class="fas fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1">
|
||
<div class="h-48 bg-gradient-to-br from-[#FF9900]/20 to-[#FF9900]/10 flex items-center justify-center">
|
||
<i class="fas fa-bolt text-6xl text-[#FF9900]"></i>
|
||
</div>
|
||
<div class="p-8">
|
||
<h3 class="text-2xl font-semibold mb-4">Lambda 无服务器</h3>
|
||
<p class="text-gray-600 leading-relaxed mb-4">无需管理服务器即可运行代码，按实际使用量付费</p>
|
||
<ul class="space-y-2 mb-6">
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">自动扩展和负载均衡</span>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">按使用量计费</span>
|
||
</li>
|
||
</ul>
|
||
<a href="#" class="inline-flex items-center text-[#FF9900] hover:text-[#FF9900]/90">
|
||
了解详情
|
||
<i class="fas fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 存储服务 -->
|
||
<section class="section bg-gray-50">
|
||
<div class="container">
|
||
<div class="max-w-4xl mx-auto text-center mb-16">
|
||
<h2 class="text-4xl font-bold text-[#333333] mb-4">存储服务</h2>
|
||
<p class="text-xl text-gray-600 leading-relaxed">安全、可靠、可扩展的存储解决方案</p>
|
||
</div>
|
||
|
||
<div class="grid md:grid-cols-3 gap-8">
|
||
<div class="bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1">
|
||
<div class="h-48 bg-gradient-to-br from-[#FF9900]/20 to-[#FF9900]/10 flex items-center justify-center">
|
||
<i class="fas fa-database text-6xl text-[#FF9900]"></i>
|
||
</div>
|
||
<div class="p-8">
|
||
<h3 class="text-2xl font-semibold mb-4">S3 对象存储</h3>
|
||
<p class="text-gray-600 leading-relaxed mb-4">安全、可靠的对象存储服务，适用于备份、归档和数据湖等场景</p>
|
||
<ul class="space-y-2 mb-6">
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">99.999999999%的持久性</span>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">无限扩展的存储空间</span>
|
||
</li>
|
||
</ul>
|
||
<a href="#" class="inline-flex items-center text-[#FF9900] hover:text-[#FF9900]/90">
|
||
了解详情
|
||
<i class="fas fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1">
|
||
<div class="h-48 bg-gradient-to-br from-[#FF9900]/20 to-[#FF9900]/10 flex items-center justify-center">
|
||
<i class="fas fa-hdd text-6xl text-[#FF9900]"></i>
|
||
</div>
|
||
<div class="p-8">
|
||
<h3 class="text-2xl font-semibold mb-4">EBS 块存储</h3>
|
||
<p class="text-gray-600 leading-relaxed mb-4">高性能的块存储服务，为EC2实例提供持久化存储</p>
|
||
<ul class="space-y-2 mb-6">
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">多种存储类型选择</span>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">支持快照备份</span>
|
||
</li>
|
||
</ul>
|
||
<a href="#" class="inline-flex items-center text-[#FF9900] hover:text-[#FF9900]/90">
|
||
了解详情
|
||
<i class="fas fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1">
|
||
<div class="h-48 bg-gradient-to-br from-[#FF9900]/20 to-[#FF9900]/10 flex items-center justify-center">
|
||
<i class="fas fa-archive text-6xl text-[#FF9900]"></i>
|
||
</div>
|
||
<div class="p-8">
|
||
<h3 class="text-2xl font-semibold mb-4">Glacier 归档存储</h3>
|
||
<p class="text-gray-600 leading-relaxed mb-4">经济高效的归档存储服务，适合长期数据保存</p>
|
||
<ul class="space-y-2 mb-6">
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">极低的存储成本</span>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">安全的数据归档</span>
|
||
</li>
|
||
</ul>
|
||
<a href="#" class="inline-flex items-center text-[#FF9900] hover:text-[#FF9900]/90">
|
||
了解详情
|
||
<i class="fas fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 数据库服务 -->
|
||
<section class="section">
|
||
<div class="container">
|
||
<div class="max-w-4xl mx-auto text-center mb-16">
|
||
<h2 class="text-4xl font-bold text-[#333333] mb-4">数据库服务</h2>
|
||
<p class="text-xl text-gray-600 leading-relaxed">全托管的数据库服务，支持多种数据库引擎</p>
|
||
</div>
|
||
|
||
<div class="grid md:grid-cols-3 gap-8">
|
||
<div class="bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1">
|
||
<div class="h-48 bg-gradient-to-br from-[#FF9900]/20 to-[#FF9900]/10 flex items-center justify-center">
|
||
<i class="fas fa-network-wired text-6xl text-[#FF9900]"></i>
|
||
</div>
|
||
<div class="p-8">
|
||
<h3 class="text-2xl font-semibold mb-4">RDS 关系型数据库</h3>
|
||
<p class="text-gray-600 leading-relaxed mb-4">易于部署和管理的关系型数据库服务，支持多种主流数据库引擎</p>
|
||
<ul class="space-y-2 mb-6">
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">支持多种数据库引擎</span>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">自动备份和恢复</span>
|
||
</li>
|
||
</ul>
|
||
<a href="#" class="inline-flex items-center text-[#FF9900] hover:text-[#FF9900]/90">
|
||
了解详情
|
||
<i class="fas fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1">
|
||
<div class="h-48 bg-gradient-to-br from-[#FF9900]/20 to-[#FF9900]/10 flex items-center justify-center">
|
||
<i class="fas fa-database text-6xl text-[#FF9900]"></i>
|
||
</div>
|
||
<div class="p-8">
|
||
<h3 class="text-2xl font-semibold mb-4">DynamoDB NoSQL数据库</h3>
|
||
<p class="text-gray-600 leading-relaxed mb-4">完全托管的NoSQL数据库服务，提供毫秒级延迟</p>
|
||
<ul class="space-y-2 mb-6">
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">自动扩展和负载均衡</span>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">毫秒级延迟</span>
|
||
</li>
|
||
</ul>
|
||
<a href="#" class="inline-flex items-center text-[#FF9900] hover:text-[#FF9900]/90">
|
||
了解详情
|
||
<i class="fas fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1">
|
||
<div class="h-48 bg-gradient-to-br from-[#FF9900]/20 to-[#FF9900]/10 flex items-center justify-center">
|
||
<i class="fas fa-search text-6xl text-[#FF9900]"></i>
|
||
</div>
|
||
<div class="p-8">
|
||
<h3 class="text-2xl font-semibold mb-4">Elasticache 缓存服务</h3>
|
||
<p class="text-gray-600 leading-relaxed mb-4">全托管的缓存服务，支持Redis和Memcached</p>
|
||
<ul class="space-y-2 mb-6">
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">支持Redis和Memcached</span>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fas fa-check text-[#FF9900] mt-1 mr-2"></i>
|
||
<span class="text-gray-600">自动扩展和备份</span>
|
||
</li>
|
||
</ul>
|
||
<a href="#" class="inline-flex items-center text-[#FF9900] hover:text-[#FF9900]/90">
|
||
了解详情
|
||
<i class="fas fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 联系我们 -->
|
||
<section class="section bg-[#232F3E] text-white">
|
||
<div class="container text-center">
|
||
<h2 class="text-4xl font-bold mb-6">需要了解更多AWS产品?</h2>
|
||
<p class="text-xl mb-8 max-w-2xl mx-auto">联系我们的产品专家，获取专业的AWS产品咨询和方案建议</p>
|
||
<a href="contact.html" class="inline-block bg-white text-black px-8 py-4 rounded hover:bg-gray-100 transition-colors duration-300">
|
||
免费咨询
|
||
<i class="fas fa-headset ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 页脚 -->
|
||
<footer class="bg-[#232F3E] text-white py-12">
|
||
<div class="container">
|
||
<div class="grid md:grid-cols-4 gap-8">
|
||
<div>
|
||
<h5 class="text-lg font-semibold mb-4">云服务专家</h5>
|
||
<p class="text-white/50 mb-4">专业的AWS云服务解决方案提供商，致力于帮助企业实现数字化转型</p>
|
||
<div class="flex space-x-4">
|
||
<a href="#" class="text-white/50 hover:text-white"><i class="fab fa-weixin"></i></a>
|
||
<a href="#" class="text-white/50 hover:text-white"><i class="fab fa-weibo"></i></a>
|
||
<a href="#" class="text-white/50 hover:text-white"><i class="fab fa-linkedin"></i></a>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<h5 class="text-lg font-semibold mb-4">AWS产品</h5>
|
||
<ul class="space-y-2">
|
||
<li><a href="products.html" class="text-white/70 hover:text-white">EC2 云服务器</a></li>
|
||
<li><a href="products.html" class="text-white/70 hover:text-white">S3 对象存储</a></li>
|
||
<li><a href="products.html" class="text-white/70 hover:text-white">RDS 数据库服务</a></li>
|
||
<li><a href="products.html" class="text-white/70 hover:text-white">Lambda 无服务器</a></li>
|
||
<li><a href="products.html" class="text-white/70 hover:text-white">更多产品...</a></li>
|
||
</ul>
|
||
</div>
|
||
<div>
|
||
<h5 class="text-lg font-semibold mb-4">解决方案</h5>
|
||
<ul class="space-y-2">
|
||
<li><a href="solutions.html" class="text-white/70 hover:text-white">网站托管</a></li>
|
||
<li><a href="solutions.html" class="text-white/70 hover:text-white">企业上云</a></li>
|
||
<li><a href="solutions.html" class="text-white/70 hover:text-white">灾备方案</a></li>
|
||
<li><a href="solutions.html" class="text-white/70 hover:text-white">大数据分析</a></li>
|
||
<li><a href="solutions.html" class="text-white/70 hover:text-white">微服务架构</a></li>
|
||
</ul>
|
||
</div>
|
||
<div>
|
||
<h5 class="text-lg font-semibold mb-4">联系我们</h5>
|
||
<ul class="space-y-2">
|
||
<li class="flex items-center">
|
||
<i class="fas fa-map-marker-alt mr-2 text-white/50"></i>
|
||
<span class="text-white/50">北京市朝阳区某某大厦</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<i class="fas fa-phone mr-2 text-white/50"></i>
|
||
<span class="text-white/50">400-123-4567</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<i class="fas fa-envelope mr-2 text-white/50"></i>
|
||
<span class="text-white/50">contact@example.com</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="border-t border-white/25 mt-12 pt-8">
|
||
<div class="flex flex-col md:flex-row justify-between items-center">
|
||
<p class="text-white/50">© 2023 云服务专家. 保留所有权利</p>
|
||
<div class="flex space-x-6 mt-4 md:mt-0">
|
||
<a href="#" class="text-white/50 hover:text-white">隐私政策</a>
|
||
<a href="#" class="text-white/50 hover:text-white">服务条款</a>
|
||
<a href="#" class="text-white/50 hover:text-white">网站地图</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<script src="src/js/main.js"></script>
|
||
</body>
|
||
</html> |