Spaces:
Running
Running
<html lang="zh-CN"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>关于我们 | 科技引领未来</title> | |
<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=Noto+Sans+SC:wght@300;400;500;700&display=swap'); | |
body { | |
font-family: 'Noto Sans SC', sans-serif; | |
scroll-behavior: smooth; | |
} | |
.hero-gradient { | |
background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%); | |
} | |
.nav-item:hover { | |
color: #3b82f6; | |
transform: translateY(-2px); | |
} | |
.company-value:hover { | |
transform: translateY(-5px); | |
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
} | |
.team-member:hover .team-img { | |
transform: scale(1.05); | |
} | |
.timeline-item:not(:last-child)::after { | |
content: ''; | |
position: absolute; | |
left: 50%; | |
bottom: -50px; | |
width: 2px; | |
height: 40px; | |
background-color: #3b82f6; | |
transform: translateX(-50%); | |
} | |
.qrcode-container:hover { | |
transform: scale(1.05); | |
} | |
</style> | |
</head> | |
<body class="bg-gray-50"> | |
<!-- Header & Navigation --> | |
<header class="sticky top-0 z-50 shadow-md bg-white"> | |
<div class="container mx-auto px-4 py-4 flex justify-between items-center"> | |
<div class="flex items-center space-x-2"> | |
<i class="fas fa-cubes text-blue-600 text-3xl"></i> | |
<span class="text-2xl font-bold text-blue-800">科技先锋</span> | |
</div> | |
<nav class="hidden md:flex space-x-8"> | |
<a href="index.html" class="nav-item font-medium text-gray-700 hover:text-blue-600 transition">首页</a> | |
<a href="technology.html" class="nav-item font-medium text-gray-700 hover:text-blue-600 transition">核心技术</a> | |
<a href="products.html" class="nav-item font-medium text-gray-700 hover:text-blue-600 transition">产品中心</a> | |
<a href="solutions.html" class="nav-item font-medium text-gray-700 hover:text-blue-600 transition">解决方案</a> | |
<a href="support.html" class="nav-item font-medium text-gray-700 hover:text-blue-600 transition">服务支持</a> | |
<a href="news.html" class="nav-item font-medium text-gray-700 hover:text-blue-600 transition">新闻动态</a> | |
<a href="partners.html" class="nav-item font-medium text-gray-700 hover:text-blue-600 transition">合作伙伴</a> | |
<a href="about.html" class="nav-item font-medium text-blue-600 hover:text-blue-700 transition">关于我们</a> | |
</nav> | |
<button class="md:hidden text-gray-700"> | |
<i class="fas fa-bars text-2xl"></i> | |
</button> | |
</div> | |
</header> | |
<!-- Hero Section --> | |
<section class="hero-gradient text-white"> | |
<div class="container mx-auto px-4 py-24 md:py-32 text-center"> | |
<h1 class="text-4xl md:text-6xl font-bold mb-6">关于科技先锋</h1> | |
<p class="text-xl md:text-2xl max-w-3xl mx-auto mb-8">致力于前沿科技研发,推动行业创新,为客户创造长期价值</p> | |
<a href="#history" class="inline-block bg-white text-blue-600 px-8 py-3 rounded-full font-semibold hover:bg-blue-50 transition duration-300"> | |
了解我们的历程 | |
</a> | |
</div> | |
</section> | |
<!-- Company Intro --> | |
<section class="py-20 bg-white"> | |
<div class="container mx-auto px-4"> | |
<div class="max-w-4xl mx-auto text-center mb-16"> | |
<h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-6">企业简介</h2> | |
<p class="text-gray-600 text-lg leading-relaxed"> | |
科技先锋成立于2008年,是国家高新技术企业、专精特新"小巨人"企业。我们专注于人工智能、大数据和云计算技术的研发与应用,致力于为企业数字化转型提供全方位的技术解决方案。经过十余年发展,已成为行业领先的科技服务提供商。 | |
</p> | |
</div> | |
<div class="grid md:grid-cols-3 gap-8"> | |
<div class="bg-gray-50 p-8 rounded-xl company-value transition duration-300"> | |
<div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6"> | |
<i class="fas fa-globe-americas text-blue-600 text-2xl"></i> | |
</div> | |
<h3 class="text-xl font-bold text-gray-800 mb-3">全球视野</h3> | |
<p class="text-gray-600">业务覆盖全球30多个国家和地区,服务超过2000家企业客户</p> | |
</div> | |
<div class="bg-gray-50 p-8 rounded-xl company-value transition duration-300"> | |
<div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6"> | |
<i class="fas fa-users text-blue-600 text-2xl"></i> | |
</div> | |
<h3 class="text-xl font-bold text-gray-800 mb-3">精英团队</h3> | |
<p class="text-gray-600">500+专业技术人才,研发人员占比超过60%,博士团队50余人</p> | |
</div> | |
<div class="bg-gray-50 p-8 rounded-xl company-value transition duration-300"> | |
<div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6"> | |
<i class="fas fa-medal text-blue-600 text-2xl"></i> | |
</div> | |
<h3 class="text-xl font-bold text-gray-800 mb-3">技术创新</h3> | |
<p class="text-gray-600">拥有300余项发明专利,荣获国家级科技奖项10余次</p> | |
</div> | |
</div> | |
</div> | |
</section> | |
<!-- Development History --> | |
<section id="history" class="py-20 bg-gray-50"> | |
<div class="container mx-auto px-4"> | |
<div class="text-center mb-16"> | |
<h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-6">发展历程</h2> | |
<p class="text-gray-600 max-w-2xl mx-auto">十余年砥砺前行,见证我们的每一步成长</p> | |
</div> | |
<div class="relative max-w-4xl mx-auto"> | |
<!-- Timeline --> | |
<div class="space-y-16"> | |
<div class="relative timeline-item"> | |
<div class="flex flex-col md:flex-row items-center"> | |
<div class="w-full md:w-1/2 mb-6 md:mb-0 md:pr-10"> | |
<div class="bg-white p-6 rounded-xl shadow-md"> | |
<h3 class="text-xl font-bold text-blue-600 mb-2">2022年</h3> | |
<p>完成D轮融资,设立欧洲研发中心,年度营收突破20亿元</p> | |
</div> | |
</div> | |
<div class="hidden md:block md:w-1/2"></div> | |
</div> | |
</div> | |
<div class="relative timeline-item"> | |
<div class="flex flex-col md:flex-row items-center"> | |
<div class="hidden md:block md:w-1/2"></div> | |
<div class="w-full md:w-1/2 mb-6 md:mb-0 md:pl-10"> | |
<div class="bg-white p-6 rounded-xl shadow-md"> | |
<h3 class="text-xl font-bold text-blue-600 mb-2">2019年</h3> | |
<p>推出行业首个AI+云原生解决方案,服务客户突破1000家</p> | |
</div> | |
</div> | |
</div> | |
</div> | |
<div class="relative timeline-item"> | |
<div class="flex flex-col md:flex-row items-center"> | |
<div class="w-full md:w-1/2 mb-6 md:mb-0 md:pr-10"> | |
<div class="bg-white p-6 rounded-xl shadow-md"> | |
<h3 class="text-xl font-bold text-blue-600 mb-2">2016年</h3> | |
<p>在全国建立5大区域技术服务中心,实现业务覆盖全国</p> | |
</div> | |
</div> | |
<div class="hidden md:block md:w-1/2"></div> | |
</div> | |
</div> | |
<div class="relative timeline-item"> | |
<div class="flex flex-col md:flex-row items-center"> | |
<div class="hidden md:block md:w-1/2"></div> | |
<div class="w-full md:w-1/2 mb-6 md:mb-0 md:pl-10"> | |
<div class="bg-white p-6 rounded-xl shadow-md"> | |
<h3 class="text-xl font-bold text-blue-600 mb-2">2012年</h3> | |
<p>获得国家高新技术企业认定,核心产品实现技术突破</p> | |
</div> | |
</div> | |
</div> | |
</div> | |
<div class="relative"> | |
<div class="flex flex-col md:flex-row items-center"> | |
<div class="w-full md:w-1/2 mb-6 md:mb-0 md:pr-10"> | |
<div class="bg-white p-6 rounded-xl shadow-md"> | |
<h3 class="text-xl font-bold text-blue-600 mb-2">2008年</h3> | |
<p>公司正式成立,专注于企业级软件研发与服务</p> | |
</div> | |
</div> | |
<div class="hidden md:block md:w-1/2"></div> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> | |
</section> | |
<!-- Management Team --> | |
<section class="py-20 bg-white"> | |
<div class="container mx-auto px-4"> | |
<div class="text-center mb-16"> | |
<h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-6">核心团队</h2> | |
<p class="text-gray-600 max-w-2xl mx-auto">汇聚行业顶尖人才,引领技术创新</p> | |
</div> | |
<div class="grid md:grid-cols-3 gap-8"> | |
<div class="team-member"> | |
<div class="overflow-hidden rounded-xl mb-4"> | |
<img src="https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=200" alt="CEO" class="w-full h-auto team-img transition duration-500"> | |
</div> | |
<h3 class="text-xl font-bold text-gray-800 mb-1">张晓明 博士</h3> | |
<p class="text-blue-600 font-medium mb-2">创始人兼CEO</p> | |
<p class="text-gray-600">曾任国际知名科技公司技术总监,拥有20余年行业经验,主导多项国家级科研项目</p> | |
</div> | |
<div class="team-member"> | |
<div class="overflow-hidden rounded-xl mb-4"> | |
<img src="https://images.unsplash.com/photo-1531123897727-8f129e1688ce?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=200" alt="CTO" class="w-full h-auto team-img transition duration-500"> | |
</div> | |
<h3 class="text-xl font-bold text-gray-800 mb-1">李华章</h3> | |
<p class="text-blue-600 font-medium mb-2">首席技术官</p> | |
<p class="text-gray-600">人工智能专家,主导公司技术研发体系构建,拥有10余项发明专利</p> | |
</div> | |
<div class="team-member"> | |
<div class="overflow-hidden rounded-xl mb-4"> | |
<img src="https://images.unsplash.com/photo-1567532939604-b6b5b0db2604?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=200" alt="CFO" class="w-full h-auto team-img transition duration duration-500"> | |
</div> | |
<h3 class="text-xl font-bold text-gray-800 mb-1">王雪琴</h3> | |
<p class="text-blue-600 font-medium mb-2">首席财务官</p> | |
<p class="text-gray-600">资深财务管理专家,曾主导多轮融资及并购项目,保障公司稳健发展</p> | |
</div> | |
</div> | |
</div> | |
</section> | |
<!-- Corporate Culture --> | |
<section class="py-20 bg-blue-600 text-white"> | |
<div class="container mx-auto px-4"> | |
<div class="text-center mb-16"> | |
<h2 class="text-3xl md:text-4xl font-bold mb-6">企业文化</h2> | |
<p class="text-blue-100 max-w-2xl mx-auto">创新、协作、责任、共赢是我们的核心价值观</p> | |
</div> | |
<div class="grid md:grid-cols-4 gap-6"> | |
<div class="bg-blue-700 p-6 rounded-xl"> | |
<h3 class="text-xl font-bold mb-4">使命</h3> | |
<p>用科技力量推动产业升级,为社会创造价值</p> | |
</div> | |
<div class="bg-blue-700 p-6 rounded-xl"> | |
<h3 class="text-xl font-bold mb-4">愿景</h3> | |
<p>成为全球领先的智能科技解决方案提供商</p> | |
</div> | |
<div class="bg-blue-700 p-6 rounded-xl"> | |
<h3 class="text-xl font-bold mb-4">价值观</h3> | |
<p>客户至上、创新进取、诚信务实、协作共赢</p> | |
</div> | |
<div class="bg-blue-700 p-6 rounded-xl"> | |
<h3 class="text-xl font-bold mb-4">社会责任</h3> | |
<p>积极参与公益事业,推动科技教育普及</p> | |
</div> | |
</div> | |
</div> | |
</section> | |
<!-- Honors --> | |
<section class="py-20 bg-white"> | |
<div class="container mx-auto px-4"> | |
<div class="text-center mb-16"> | |
<h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-6">荣誉资质</h2> | |
<p class="text-gray-600 max-w-2xl mx-auto">业界认可,权威认证</p> | |
</div> | |
<div class="grid grid-cols-2 md:grid-cols-4 gap-6"> | |
<div class="bg-gray-50 p-6 rounded-xl flex flex-col items-center"> | |
<i class="fas fa-medal text-4xl text-yellow-500 mb-4"></i> | |
<p class="text-center font-medium">国家级专精特新"小巨人"企业</p> | |
</div> | |
<div class="bg-gray-50 p-6 rounded-xl flex flex-col items-center"> | |
<i class="fas fa-award text-4xl text-blue-500 mb-4"></i> | |
<p class="text-center font-medium">高新技术企业认证</p> | |
</div> | |
<div class="bg-gray-50 p-6 rounded-xl flex flex-col items-center"> | |
<i class="fas fa-certificate text-4xl text-green-500 mb-4"></i> | |
<p class="text-center font-medium">ISO27001信息安全认证</p> | |
</div> | |
<div class="bg-gray-50 p-6 rounded-xl flex flex-col items-center"> | |
<i class="fas fa-trophy text-4xl text-red-500 mb-4"></i> | |
<p class="text-center font-medium">中国科技企业50强</p> | |
</div> | |
</div> | |
</div> | |
</section> | |
<!-- Footer --> | |
<footer class="bg-gray-900 text-white pt-16 pb-8"> | |
<div class="container mx-auto px-4"> | |
<div class="grid md:grid-cols-5 gap-8 mb-12"> | |
<!-- Logo & Slogan --> | |
<div class="md:col-span-2"> | |
<div class="flex items-center mb-6"> | |
<i class="fas fa-cubes text-blue-400 text-3xl mr-2"></i> | |
<span class="text-2xl font-bold">科技先锋</span> | |
</div> | |
<p class="text-gray-400 mb-6 leading-relaxed"> | |
"技术驱动未来,创新引领变革" — 我们致力于为企业提供最具前瞻性的技术解决方案,携手客户共同成长。 | |
</p> | |
<div class="flex space-x-4"> | |
<a href="#" class="text-gray-400 hover:text-white transition"><i class="fab fa-weixin"></i></a> | |
<a href="#" class="text-gray-400 hover:text-white transition"><i class="fab fa-weibo"></i></a> | |
<a href="#" class="text-gray-400 hover:text-white transition"><i class="fab fa-linkedin"></i></a> | |
<a href="#" class="text-gray-400 hover:text-white transition"><i class="fab fa-youtube"></i></a> | |
</div> | |
</div> | |
<!-- Sitemap --> | |
<div> | |
<h4 class="text-lg font-semibold mb-4">网站导航</h4> | |
<ul class="space-y-3"> | |
<li><a href="index.html" class="text-gray-400 hover:text-white transition">首页</a></li> | |
<li><a href="technology.html" class="text-gray-400 hover:text-white transition">核心技术</a></li> | |
<li><a href="products.html" class="text-gray-400 hover:text-white transition">产品中心</a></li> | |
<li><a href="solutions.html" class="text-gray-400 hover:text-white transition">解决方案</a></li> | |
<li><a href="support.html" class="text-gray-400 hover:text-white transition">服务支持</a></li> | |
<li><a href="news.html" class="text-gray-400 hover:text-white transition">新闻动态</a></li> | |
<li><a href="partners.html" class="text-gray-400 hover:text-white transition">合作伙伴</a></li> | |
<li><a href="about.html" class="text-gray-400 hover:text-white transition">关于我们</a></li> | |
</ul> | |
</div> | |
<!-- QR Codes --> | |
<div> | |
<h4 class="text-lg font-semibold mb-4">关注我们</h4> | |
<div class="flex space-x-4"> | |
<div class="qrcode-container transition duration-300"> | |
<img src="https://via.placeholder.com/120x120" alt="微信公众号" class="w-28 h-28 mb-2 rounded"> | |
<p class="text-sm text-gray-400 text-center">微信公众号</p> | |
</div> | |
<div class="qrcode-container transition duration-300"> | |
<img src="https://via.placeholder.com/120x120" alt="抖音号" class="w-28 h-28 mb-2 rounded"> | |
<p class="text-sm text-gray-400 text-center">官方抖音号</p> | |
</div> | |
</div> | |
</div> | |
<!-- Contact Info --> | |
<div> | |
<h4 class="text-lg font-semibold mb-4">联系我们</h4> | |
<ul class="space-y-3"> | |
<li class="flex items-start"> | |
<i class="fas fa-map-marker-alt text-blue-400 mt-1 mr-2"></i> | |
<span class="text-gray-400">中国上海市浦东新区张江高科技园区科技大道88号</span> | |
</li> | |
<li class="flex items-center"> | |
<i class="fas fa-phone-alt text-blue-400 mr-2"></i> | |
<span class="text-gray-400">400-888-8888</span> | |
</li> | |
<li class="flex items-center"> | |
<i class="fas fa-envelope text-blue-400 mr-2"></i> | |
<span class="text-gray-400">[email protected]</span> | |
</li> | |
<li class="flex items-center"> | |
<i class="fas fa-clock text-blue-400 mr-2"></i> | |
<span class="text-gray-400">周一至周五 9:00-18:00</span> | |
</li> | |
</ul> | |
</div> | |
</div> | |
<div class="border-t border-gray-800 pt-8 text-center text-gray-500 text-sm"> | |
<p class="mb-2">© 2008-2023 科技先锋科技有限公司 版权所有</p> | |
<p class="mb-2"> | |
<a href="#" class="hover:text-gray-300 transition">隐私政策</a> | | |
<a href="#" class="hover:text-gray-300 transition">使用条款</a> | | |
<a href="#" class="hover:text-gray-300 transition">法律声明</a> | |
</p> | |
<p>ICP备案号:沪ICP备12345678号-1 | 沪公网安备31011502001234号</p> | |
</div> | |
</div> | |
</footer> | |
<script> | |
// Simple mobile menu toggle | |
document.querySelector('button').addEventListener('click', function() { | |
// In a real implementation, this would toggle a mobile menu | |
alert('移动端菜单将在实际实现中展开'); | |
}); | |
</script> | |
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - <a href="https://enzostvs-deepsite.hf.space?remix=doniexun/hexavii-aboutus" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body> | |
</html> |