admin/haiguji-website-export
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

全站统一深色岩层背景+粒子特效；导航/底部无缝融合；底部导航结构调整

Browse Source 
- body 改为固定(background-attachment: fixed)的深色岩层渐变+噪点纹理，作为全站统一背景，所有子页面的主体区域都与首页品牌视觉背景一致
- 新增全局唯一的跟随鼠标粒子画布(.site-particles，position:fixed铺满视口)，替换掉原来仅限首页hero/子页面page-hero局部的粒子画布
- about.css/pages.css/resources.css 全面转换为深色主题配色：白色卡片背景改为半透明深蓝玻璃质感，深色文字改为冰蓝/浅蓝，浅色边框改为半透明冰蓝边框
- 顶部导航：默认完全透明，滚动后切换为与背景同色调的深色玻璃底色，不再出现白色导航栏
- 底部导航：footer-fade渐变上色改为与页面背景一致(rock-navy-0)，下色改为更深的近黑色，形成无缝过渡
- 底部导航结构调整：合作伙伴模块删除，合并为「关于海古纪」列表下的一个链接项；「关于海古纪」下的隐私协议链接删除，改为footer-bottom的“隐私政策”链接跳转到实际隐私协议内容
- 联系信息电话号码字体与其余文字保持一致（去除等宽字体特殊样式）
- footer-section标题颜色统一改为与首页“最新动态”一致的冰蓝色(--ice-blue)
This commit is contained in:
Claude
2026-07-15 03:04:15 +00:00
parent 41554ee60c
commit 431b0a7c38
15 changed files with 316 additions and 441 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/about.css
+24 -24
View File
@@ -15,7 +15,7 @@
.about-section h2 {
font-size: 2rem;
margin-bottom: 30px;
color: var(--primary-blue);
color: var(--ice-blue);
border-bottom: 3px solid var(--accent-color);
padding-bottom: 15px;
}
@@ -23,19 +23,19 @@
.about-section h3 {
font-size: 1.2rem;
margin: 25px 0 15px 0;
color: var(--primary-purple);
color: var(--electric-blue);
}
/* 鍏徃浠嬬粛 */
.company-intro {
background: var(--light-bg);
background: rgba(18, 29, 52, 0.42);
padding: 30px;
border-radius: 10px;
margin-bottom: 30px;
}
.company-intro p {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
line-height: 1.8;
margin-bottom: 15px;
}
@@ -60,19 +60,19 @@
}
.highlight-item h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 10px;
}
.highlight-item p {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
font-size: 0.9rem;
line-height: 1.6;
}
/* 鍥㈤槦淇℃伅 */
.team-section {
background: white;
background: rgba(18, 29, 52, 0.55);
padding: 30px;
border-radius: 10px;
border-top: 4px solid var(--primary-purple);
@@ -84,7 +84,7 @@
.team-info p {
margin-bottom: 10px;
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
line-height: 1.8;
}
@@ -103,25 +103,25 @@
}
.info-block {
background: var(--light-bg);
background: rgba(18, 29, 52, 0.42);
padding: 20px;
border-radius: 10px;
border-left: 4px solid var(--primary-purple);
}
.info-block h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 10px;
}
.info-block p {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
margin: 0;
}
/* 鑱旂郴琛ㄥ崟 */
.contact-form {
background: white;
background: rgba(18, 29, 52, 0.55);
padding: 30px;
border-radius: 10px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
@@ -129,7 +129,7 @@
.contact-form h3 {
margin-top: 0;
color: var(--primary-blue);
color: var(--ice-blue);
}
.form-group {
@@ -139,7 +139,7 @@
.form-group label {
display: block;
margin-bottom: 8px;
color: var(--dark-text);
color: var(--ice-blue);
font-weight: 600;
font-size: 0.9rem;
}
@@ -149,7 +149,7 @@
.form-group textarea {
width: 100%;
padding: 10px;
border: 1px solid #ddd;
border: 1px solid rgba(156, 198, 236, 0.22);
border-radius: 5px;
font-family: inherit;
font-size: 0.9rem;
@@ -160,7 +160,7 @@
.form-group select:focus,
.form-group textarea:focus {
outline: none;
border-color: var(--primary-purple);
border-color: var(--electric-blue);
box-shadow: 0 0 0 3px rgba(106, 44, 145, 0.1);
}
@@ -204,27 +204,27 @@
}
.timeline-date {
color: var(--primary-purple);
color: var(--electric-blue);
font-weight: 600;
font-size: 0.9rem;
margin-bottom: 5px;
}
.timeline-content h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin: 0 0 10px 0;
font-size: 1.05rem;
}
.timeline-content p {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
margin: 0;
line-height: 1.6;
}
/* 闅愮鏀跨瓥鍐呭 */
.privacy-content {
background: white;
background: rgba(18, 29, 52, 0.55);
padding: 30px;
border-radius: 10px;
line-height: 1.8;
@@ -232,12 +232,12 @@
.privacy-content h3 {
margin: 25px 0 15px 0;
color: var(--primary-blue);
color: var(--ice-blue);
font-size: 1.05rem;
}
.privacy-content p {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
margin-bottom: 15px;
}
@@ -306,13 +306,13 @@
}
.form-hint {
color: #6b7280;
color: rgba(207, 232, 255, 0.62);
font-size: 0.88rem;
margin-top: 6px;
}
.form-error {
color: #b91c1c;
color: #fca5a5;
font-size: 0.9rem;
margin-top: 8px;
}
css/footer.css
+7 -35
View File
@@ -1,13 +1,13 @@
/* 底部渐变过渡：从页面内容过渡到深蓝底部 */
/* 底部渐变过渡：上色与页面背景一致，下色更深，形成无缝过渡 */
.footer-fade {
height: 160px;
background: linear-gradient(180deg, transparent 0%, rgba(5, 7, 12, 0.75) 65%, var(--rock-navy-0) 100%);
background: linear-gradient(180deg, var(--rock-navy-0) 0%, #020409 100%);
pointer-events: none;
}
/* 底部样式 —— 深邃岩层蓝 */
/* 底部样式 —— 顶部与页面背景同色，底部更深邃 */
.footer {
background: linear-gradient(180deg, var(--rock-navy-0) 0%, #020409 100%);
background: linear-gradient(180deg, #020409 0%, #000103 100%);
color: white;
padding: 28px 0 12px;
}
@@ -17,15 +17,15 @@
margin: 0 auto;
padding: 0 20px;
display: grid;
grid-template-columns: 1.15fr 0.9fr 1.35fr 0.9fr;
gap: 22px;
grid-template-columns: 1.1fr 1fr 0.9fr;
gap: 30px;
margin-bottom: 20px;
}
.footer-section h3 {
font-size: 1.2rem;
margin-bottom: 10px;
color: var(--electric-blue, #00d4ff);
color: var(--ice-blue, #cfe8ff);
font-weight: 600;
}
@@ -37,8 +37,6 @@
}
.footer-phone {
font-family: 'JetBrains Mono', monospace;
letter-spacing: 0.02em;
color: var(--ice-blue, #cfe8ff);
opacity: 1 !important;
}
@@ -59,32 +57,6 @@
font-size: 0.95rem;
}
.footer-section-partners {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.footer-partners-link {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 10px 18px;
color: var(--ice-blue, #cfe8ff);
text-decoration: none;
border: 1px solid rgba(156, 198, 236, 0.35);
border-radius: 999px;
font-size: 0.9rem;
background: rgba(56, 189, 248, 0.06);
transition: all 0.3s;
}
.footer-partners-link:hover {
border-color: var(--electric-blue, #38bdf8);
background: rgba(56, 189, 248, 0.14);
color: white;
}
.qr-grid {
display: grid;
grid-template-columns: repeat(3, 54px);
css/nav.css
+3 -3
View File
@@ -12,11 +12,11 @@
}
.navbar.is-scrolled {
background: rgba(5, 7, 14, 0.72);
background: rgba(10, 17, 32, 0.7);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
box-shadow: 0 8px 26px rgba(2, 6, 14, 0.35);
border-bottom: 1px solid rgba(156, 198, 236, 0.14);
box-shadow: 0 8px 26px rgba(2, 6, 14, 0.3);
border-bottom: 1px solid rgba(156, 198, 236, 0.12);
}
.nav-container {
css/pages.css
+58 -86
View File
@@ -2,12 +2,7 @@
.page-hero {
position: relative;
overflow: hidden;
background:
radial-gradient(ellipse 60% 50% at 20% 20%, rgba(148, 163, 184, 0.16), transparent 60%),
radial-gradient(ellipse 55% 45% at 85% 15%, rgba(56, 189, 248, 0.10), transparent 60%),
repeating-linear-gradient(150deg, rgba(200, 214, 232, 0.045) 0px, rgba(200, 214, 232, 0.045) 2px, transparent 2px, transparent 24px),
repeating-linear-gradient(66deg, rgba(9, 14, 26, 0.32) 0px, rgba(9, 14, 26, 0.32) 3px, transparent 3px, transparent 38px),
linear-gradient(150deg, var(--rock-navy-0) 0%, var(--rock-navy-1) 45%, var(--rock-navy-2) 78%, var(--rock-navy-3) 100%);
background: transparent;
color: white;
padding: 56px 20px;
text-align: center;
@@ -19,34 +14,11 @@
justify-content: center;
}
.page-hero::before {
content: "";
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
opacity: 0.6;
mix-blend-mode: overlay;
background-image:
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='320' height='320'><filter id='pn'><feTurbulence type='fractalNoise' baseFrequency='0.012 0.06' numOctaves='4' seed='11' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='gamma' amplitude='1' exponent='2.2' offset='0'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23pn)'/></svg>"),
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='pm'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%' height='100%' filter='url(%23pm)'/></svg>");
background-size: 620px 620px, 180px 180px;
}
.page-hero-content {
position: relative;
z-index: 2;
}
.page-hero-particles {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
z-index: 1;
pointer-events: none;
}
.page-hero-content h1 {
font-size: 2.5rem;
margin-bottom: 15px;
@@ -76,7 +48,7 @@
}
.product-nav {
background: var(--light-bg);
background: rgba(18, 29, 52, 0.42);
padding: 20px;
border-radius: 6px;
border-left: 4px solid var(--primary-purple);
@@ -85,7 +57,7 @@
.nav-section h3 {
font-size: 1.1rem;
margin-bottom: 15px;
color: var(--primary-purple);
color: var(--electric-blue);
}
.nav-section ul {
@@ -99,7 +71,7 @@
.nav-section .nav-item {
display: block;
padding: 8px 12px;
color: #333;
color: var(--ice-blue);
text-decoration: none;
border-radius: 5px;
transition: all 0.3s;
@@ -108,9 +80,9 @@
.nav-section .nav-item:hover,
.nav-section .nav-item.active {
background: white;
color: var(--primary-purple);
border-left-color: var(--primary-purple);
background: rgba(18, 29, 52, 0.55);
color: var(--electric-blue);
border-left-color: var(--electric-blue);
padding-left: 15px;
}
@@ -132,14 +104,14 @@
.product-section h2 {
font-size: 2rem;
margin-bottom: 10px;
color: var(--primary-blue);
color: var(--ice-blue);
border-bottom: 3px solid var(--accent-color);
padding-bottom: 15px;
}
.intro-subtitle {
font-size: 1.1rem;
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
margin-bottom: 30px;
font-style: italic;
}
@@ -149,7 +121,7 @@
display: flex;
gap: 10px;
margin: 30px 0;
border-bottom: 2px solid #eee;
border-bottom: 2px solid rgba(156, 198, 236, 0.16);
}
.tab-btn {
@@ -158,18 +130,18 @@
padding: 12px 20px;
font-size: 0.95rem;
cursor: pointer;
color: #666;
color: rgba(207, 232, 255, 0.62);
border-bottom: 3px solid transparent;
transition: all 0.3s;
}
.tab-btn:hover {
color: var(--primary-purple);
color: var(--electric-blue);
}
.tab-btn.active {
color: var(--primary-purple);
border-bottom-color: var(--primary-purple);
color: var(--electric-blue);
border-bottom-color: var(--electric-blue);
}
.tab-content {
@@ -208,8 +180,8 @@
}
.media-card {
background: white;
border: 1px solid #edf0f5;
background: rgba(18, 29, 52, 0.55);
border: 1px solid rgba(156, 198, 236, 0.18);
border-radius: 8px;
padding: 14px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
@@ -219,32 +191,32 @@
width: 100%;
height: 180px;
object-fit: contain;
background: #f8fafc;
background: rgba(10, 17, 32, 0.5);
border-radius: 6px;
margin-bottom: 10px;
}
.media-card h4 {
color: var(--primary-blue);
color: var(--ice-blue);
font-size: 0.98rem;
margin-bottom: 6px;
}
.media-card p {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
font-size: 0.88rem;
line-height: 1.55;
}
.feature-item {
background: var(--light-bg);
background: rgba(18, 29, 52, 0.42);
padding: 25px;
border-radius: 6px;
border-left: 4px solid var(--primary-purple);
}
.feature-item h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 15px;
font-size: 1.05rem;
}
@@ -258,7 +230,7 @@
margin-bottom: 10px;
padding-left: 20px;
position: relative;
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
line-height: 1.6;
}
@@ -280,7 +252,7 @@
}
.highlight-box h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 15px;
}
@@ -307,7 +279,7 @@
}
.workflow-section h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 20px;
}
@@ -319,7 +291,7 @@
gap: 15px;
overflow-x: auto;
padding: 20px;
background: var(--light-bg);
background: rgba(18, 29, 52, 0.42);
border-radius: 6px;
}
@@ -346,13 +318,13 @@
.step-name {
font-weight: 600;
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 5px;
}
.workflow-step p {
font-size: 0.85rem;
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
}
.workflow-arrow {
@@ -370,7 +342,7 @@
}
.case-item {
background: white;
background: rgba(18, 29, 52, 0.55);
padding: 25px;
border-radius: 6px;
box-shadow: 0 2px 8px rgba(16, 41, 79, 0.08);
@@ -384,12 +356,12 @@
}
.case-item h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 10px;
}
.case-item p {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
line-height: 1.6;
}
@@ -399,14 +371,14 @@
}
.table-section h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 15px;
}
.service-table {
width: 100%;
border-collapse: collapse;
background: white;
background: rgba(18, 29, 52, 0.55);
border-radius: 6px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(16, 41, 79, 0.08);
@@ -425,12 +397,12 @@
.service-table td {
padding: 15px;
border-bottom: 1px solid #eee;
color: var(--light-text);
border-bottom: 1px solid rgba(156, 198, 236, 0.16);
color: rgba(207, 232, 255, 0.62);
}
.service-table tbody tr:hover {
background: var(--light-bg);
background: rgba(18, 29, 52, 0.42);
}
.service-table tbody tr:last-child td {
@@ -446,7 +418,7 @@
}
.app-item {
background: var(--light-bg);
background: rgba(18, 29, 52, 0.42);
padding: 20px;
border-radius: 6px;
border-left: 4px solid var(--accent-color);
@@ -454,18 +426,18 @@
}
.app-item:hover {
background: white;
background: rgba(18, 29, 52, 0.55);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
border-left-color: var(--primary-purple);
border-left-color: var(--electric-blue);
}
.app-item h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 10px;
}
.app-item p {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
line-height: 1.6;
}
@@ -485,12 +457,12 @@
}
.result-item h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 10px;
}
.result-item p {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
}
/* 占位符和提示框 */
@@ -507,7 +479,7 @@
.placeholder-section h4,
.contact-prompt h4,
.info-box h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 15px;
}
@@ -522,7 +494,7 @@
margin-bottom: 10px;
padding-left: 20px;
position: relative;
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
}
.placeholder-section ul li:before,
@@ -540,7 +512,7 @@
}
.doc-link:hover {
color: #00a8cc;
color: var(--ice-blue);
text-decoration: underline;
}
@@ -617,7 +589,7 @@
/* 专业学术版式增强 */
.product-content {
max-width: 980px;
background: #fff;
background: rgba(18, 29, 52, 0.55);
}
.product-section h2,
@@ -628,7 +600,7 @@
.prose-block {
margin: 24px 0;
color: #34405a;
color: rgba(207, 232, 255, 0.62);
line-height: 1.9;
font-size: 0.98rem;
}
@@ -639,9 +611,9 @@
.inline-figure {
margin: 18px 0 26px;
border: 1px solid #e6ebf2;
border: 1px solid rgba(156, 198, 236, 0.18);
border-radius: 6px;
background: #fff;
background: rgba(18, 29, 52, 0.55);
padding: 12px;
}
@@ -656,13 +628,13 @@
width: 100%;
max-height: 360px;
object-fit: contain;
background: #f8fafc;
background: rgba(10, 17, 32, 0.5);
border-radius: 4px;
}
.inline-figure figcaption {
margin-top: 8px;
color: #64748b;
color: rgba(207, 232, 255, 0.62);
font-size: 0.86rem;
text-align: center;
}
@@ -686,7 +658,7 @@
max-width: 92vw;
max-height: 88vh;
object-fit: contain;
background: white;
background: rgba(18, 29, 52, 0.55);
border-radius: 6px;
box-shadow: 0 18px 60px rgba(0, 0, 0, 0.35);
}
@@ -699,8 +671,8 @@
height: 40px;
border: 0;
border-radius: 50%;
background: rgba(255, 255, 255, 0.92);
color: #10294f;
background: rgba(18, 29, 52, 0.7);
color: var(--ice-blue);
font-size: 1.35rem;
cursor: pointer;
}
@@ -713,9 +685,9 @@
gap: 20px;
align-items: center;
padding: 16px;
border: 1px solid #e5ebf3;
border: 1px solid rgba(156, 198, 236, 0.18);
border-radius: 8px;
background: #f8fafc;
background: rgba(10, 17, 32, 0.5);
}
.service-video-block video {
@@ -727,12 +699,12 @@
}
.service-video-block h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin-bottom: 8px;
}
.service-video-block p {
color: #34405a;
color: rgba(207, 232, 255, 0.62);
line-height: 1.75;
}
css/resources.css
+44 -44
View File
@@ -15,7 +15,7 @@
}
.filter-section {
background: var(--light-bg);
background: rgba(18, 29, 52, 0.42);
padding: 20px;
border-radius: 10px;
border-left: 4px solid var(--primary-purple);
@@ -24,7 +24,7 @@
.filter-section h3 {
font-size: 1.1rem;
margin-bottom: 20px;
color: var(--primary-purple);
color: var(--electric-blue);
}
.filter-group {
@@ -36,17 +36,17 @@
font-size: 0.9rem;
font-weight: 600;
margin-bottom: 8px;
color: var(--dark-text);
color: var(--ice-blue);
}
.filter-group select,
.filter-group input {
width: 100%;
padding: 8px;
border: 1px solid #ddd;
border: 1px solid rgba(156, 198, 236, 0.22);
border-radius: 5px;
font-size: 0.85rem;
background: white;
background: rgba(18, 29, 52, 0.55);
cursor: pointer;
transition: border-color 0.3s;
}
@@ -55,7 +55,7 @@
.filter-group select:focus,
.filter-group input:hover,
.filter-group input:focus {
border-color: var(--primary-purple);
border-color: var(--electric-blue);
outline: none;
}
@@ -81,7 +81,7 @@
margin: 10px auto 0;
background: none;
border: 0;
color: var(--primary-purple);
color: var(--electric-blue);
cursor: pointer;
font-size: 0.86rem;
text-decoration: underline;
@@ -89,8 +89,8 @@
.empty-result {
display: none;
color: var(--light-text);
background: var(--light-bg);
color: rgba(207, 232, 255, 0.62);
background: rgba(18, 29, 52, 0.42);
border-left: 4px solid var(--primary-purple);
padding: 16px;
border-radius: 8px;
@@ -109,7 +109,7 @@
.resource-section h2 {
font-size: 2rem;
margin-bottom: 30px;
color: var(--primary-blue);
color: var(--ice-blue);
border-bottom: 3px solid var(--accent-color);
padding-bottom: 15px;
}
@@ -122,7 +122,7 @@
}
.resource-card {
background: white;
background: rgba(18, 29, 52, 0.55);
border-radius: 10px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
overflow: hidden;
@@ -139,7 +139,7 @@
.card-header {
padding: 20px;
background: linear-gradient(135deg, rgba(30, 60, 114, 0.05) 0%, rgba(106, 44, 145, 0.05) 100%);
border-bottom: 2px solid #f0f0f0;
border-bottom: 2px solid rgba(156, 198, 236, 0.16);
display: flex;
justify-content: space-between;
align-items: flex-start;
@@ -147,7 +147,7 @@
}
.card-header h4 {
color: var(--primary-blue);
color: var(--ice-blue);
font-size: 1.05rem;
flex: 1;
margin: 0;
@@ -164,7 +164,7 @@
.card-meta {
padding: 15px 20px;
border-bottom: 1px solid #f0f0f0;
border-bottom: 1px solid rgba(156, 198, 236, 0.16);
display: flex;
justify-content: space-between;
align-items: center;
@@ -173,7 +173,7 @@
}
.journal {
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
flex: 1;
}
@@ -190,10 +190,10 @@
.card-desc {
padding: 15px 20px;
flex: 1;
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
font-size: 0.9rem;
line-height: 1.6;
border-bottom: 1px solid #f0f0f0;
border-bottom: 1px solid rgba(156, 198, 236, 0.16);
}
.card-tags {
@@ -201,12 +201,12 @@
display: flex;
flex-wrap: wrap;
gap: 8px;
border-bottom: 1px solid #f0f0f0;
border-bottom: 1px solid rgba(156, 198, 236, 0.16);
}
.tag {
background: var(--light-bg);
color: var(--primary-blue);
background: rgba(18, 29, 52, 0.42);
color: var(--ice-blue);
padding: 4px 10px;
border-radius: 15px;
font-size: 0.75rem;
@@ -223,8 +223,8 @@
}
.card-link:hover {
color: #00a8cc;
background: var(--light-bg);
color: var(--ice-blue);
background: rgba(18, 29, 52, 0.42);
}
/* 瑙嗛缃戞牸 */
@@ -235,7 +235,7 @@
}
.video-card {
background: white;
background: rgba(18, 29, 52, 0.55);
border-radius: 10px;
overflow: hidden;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
@@ -289,14 +289,14 @@
.video-card h4 {
padding: 15px;
margin: 0;
color: var(--primary-blue);
color: var(--ice-blue);
font-size: 1rem;
}
.video-card p {
padding: 0 15px;
margin: 0 0 10px 0;
color: var(--light-text);
color: rgba(207, 232, 255, 0.62);
font-size: 0.9rem;
}
@@ -352,8 +352,8 @@
}
.news-feature-card {
background: #fff;
border: 1px solid #e5ebf3;
background: rgba(18, 29, 52, 0.55);
border: 1px solid rgba(156, 198, 236, 0.18);
border-radius: 8px;
overflow: hidden;
box-shadow: 0 8px 24px rgba(16, 41, 79, 0.08);
@@ -365,8 +365,8 @@
gap: 28px;
align-items: center;
padding: 24px;
background: #f8fafc;
border-bottom: 1px solid #e5ebf3;
background: rgba(10, 17, 32, 0.5);
border-bottom: 1px solid rgba(156, 198, 236, 0.18);
}
.news-feature-hero img,
@@ -374,7 +374,7 @@
.news-image-grid img {
width: 100%;
border-radius: 6px;
background: #fff;
background: rgba(18, 29, 52, 0.55);
object-fit: cover;
cursor: zoom-in;
}
@@ -392,7 +392,7 @@
}
.news-feature-hero h3 {
color: var(--primary-blue);
color: var(--ice-blue);
font-size: 1.55rem;
line-height: 1.35;
margin-bottom: 12px;
@@ -401,7 +401,7 @@
.news-feature-hero p,
.news-prose p,
.news-prose li {
color: #34405a;
color: rgba(207, 232, 255, 0.62);
line-height: 1.85;
}
@@ -410,7 +410,7 @@
}
.news-prose h4 {
color: var(--primary-blue);
color: var(--ice-blue);
margin: 10px 0 12px;
font-size: 1.08rem;
}
@@ -423,9 +423,9 @@
.news-inline-figure {
margin: 20px 0;
padding: 12px;
border: 1px solid #e5ebf3;
border: 1px solid rgba(156, 198, 236, 0.18);
border-radius: 8px;
background: #f8fafc;
background: rgba(10, 17, 32, 0.5);
}
.news-inline-figure img {
@@ -436,7 +436,7 @@
.news-inline-figure figcaption,
.news-image-grid figcaption {
margin-top: 8px;
color: #64748b;
color: rgba(207, 232, 255, 0.62);
font-size: 0.84rem;
line-height: 1.5;
text-align: center;
@@ -452,9 +452,9 @@
.news-image-grid figure {
margin: 0;
padding: 12px;
border: 1px solid #e5ebf3;
border: 1px solid rgba(156, 198, 236, 0.18);
border-radius: 8px;
background: #fff;
background: rgba(18, 29, 52, 0.55);
}
.news-image-grid img {
@@ -504,7 +504,7 @@
display: flex;
gap: 10px;
margin: 0 0 28px;
border-bottom: 2px solid #e5ebf3;
border-bottom: 2px solid rgba(156, 198, 236, 0.18);
flex-wrap: wrap;
}
@@ -512,7 +512,7 @@
background: none;
border: none;
padding: 12px 20px;
color: #5f6b7a;
color: rgba(207, 232, 255, 0.62);
font-size: 0.95rem;
cursor: pointer;
border-bottom: 3px solid transparent;
@@ -521,8 +521,8 @@
.resource-tab:hover,
.resource-tab.active {
color: var(--primary-purple);
border-bottom-color: var(--primary-purple);
color: var(--electric-blue);
border-bottom-color: var(--electric-blue);
}
.resource-section {
@@ -541,8 +541,8 @@
width: 100%;
height: 180px;
object-fit: contain;
background: #f8fafc;
border-bottom: 1px solid #e5ebf3;
background: rgba(10, 17, 32, 0.5);
border-bottom: 1px solid rgba(156, 198, 236, 0.18);
cursor: zoom-in;
}
css/style.css
+37 -48
View File
@@ -28,9 +28,42 @@
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
color: var(--dark-text);
color: var(--ice-blue);
line-height: 1.6;
background-color: #fff;
position: relative;
background:
radial-gradient(ellipse 60% 45% at 18% 10%, rgba(148, 163, 184, 0.14), transparent 60%),
radial-gradient(ellipse 55% 40% at 82% 6%, rgba(110, 130, 170, 0.12), transparent 60%),
radial-gradient(ellipse 70% 55% at 85% 92%, rgba(56, 189, 248, 0.09), transparent 65%),
repeating-linear-gradient(152deg, rgba(200, 214, 232, 0.04) 0px, rgba(200, 214, 232, 0.04) 2px, transparent 2px, transparent 26px),
repeating-linear-gradient(64deg, rgba(9, 14, 26, 0.3) 0px, rgba(9, 14, 26, 0.3) 3px, transparent 3px, transparent 40px),
linear-gradient(180deg, var(--rock-navy-1) 0%, var(--rock-navy-2) 45%, var(--rock-navy-1) 75%, var(--rock-navy-0) 100%);
background-attachment: fixed, fixed, fixed, fixed, fixed, fixed;
}
body::before {
content: "";
position: fixed;
inset: 0;
z-index: -1;
pointer-events: none;
opacity: 0.55;
mix-blend-mode: overlay;
background-image:
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='320' height='320'><filter id='bn'><feTurbulence type='fractalNoise' baseFrequency='0.012 0.06' numOctaves='4' seed='7' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='gamma' amplitude='1' exponent='2.2' offset='0'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23bn)'/></svg>"),
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='bm'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%' height='100%' filter='url(%23bm)'/></svg>");
background-size: 620px 620px, 180px 180px;
background-attachment: fixed, fixed;
}
/* 全站跟随鼠标的粒子背景（固定在视口，任意页面、任意滚动位置都可见） */
.site-particles {
position: fixed;
inset: 0;
width: 100%;
height: 100%;
z-index: -1;
pointer-events: none;
}
.container {
@@ -39,58 +72,14 @@ body {
padding: 0 20px;
}
/* 英雄部分 —— 深海岩层背景 */
/* 英雄部分 —— 与全站统一的深海岩层背景（由 body 提供），此处保持透明 */
.hero {
position: relative;
height: 62vh;
min-height: 460px;
max-height: 680px;
overflow: hidden;
background:
radial-gradient(ellipse 60% 45% at 18% 15%, rgba(148, 163, 184, 0.18), transparent 60%),
radial-gradient(ellipse 55% 40% at 78% 10%, rgba(110, 130, 170, 0.16), transparent 60%),
radial-gradient(ellipse 70% 55% at 82% 88%, rgba(56, 189, 248, 0.11), transparent 65%),
repeating-linear-gradient(152deg, rgba(200, 214, 232, 0.05) 0px, rgba(200, 214, 232, 0.05) 2px, transparent 2px, transparent 26px),
repeating-linear-gradient(64deg, rgba(9, 14, 26, 0.35) 0px, rgba(9, 14, 26, 0.35) 3px, transparent 3px, transparent 40px),
linear-gradient(160deg, var(--rock-navy-0) 0%, var(--rock-navy-1) 40%, var(--rock-navy-2) 72%, var(--rock-navy-3) 100%);
}
/* 岩石颗粒质感叠加层（更明显的岩石纹理） */
.hero::before {
content: "";
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
opacity: 0.65;
mix-blend-mode: overlay;
background-image:
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='320' height='320'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.012 0.06' numOctaves='4' seed='7' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='gamma' amplitude='1' exponent='2.2' offset='0'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"),
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='m'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%' height='100%' filter='url(%23m)'/></svg>");
background-size: 620px 620px, 180px 180px;
}
/* 岩壁棱线光影 */
.hero::after {
content: "";
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
background:
linear-gradient(105deg, transparent 30%, rgba(180, 196, 220, 0.06) 42%, transparent 54%),
linear-gradient(72deg, transparent 55%, rgba(180, 196, 220, 0.05) 63%, transparent 74%),
linear-gradient(18deg, transparent 60%, rgba(56, 189, 248, 0.05) 68%, transparent 78%);
}
/* 右下角跟随鼠标的粒子网络画布 */
.hero-particles {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
z-index: 1;
pointer-events: none;
background: transparent;
}
.hero-carousel {
index.html
+3 -8
View File
@@ -14,6 +14,7 @@
</head>
<body>
<canvas class="site-particles" aria-hidden="true"></canvas>
<!-- 导航栏 -->
<nav class="navbar">
<div class="nav-container">
@@ -95,7 +96,6 @@
<!-- 首页 -->
<section id="home" class="hero">
<canvas class="hero-particles" aria-hidden="true"></canvas>
<div class="hero-carousel">
<!-- 品牌主视觉 -->
<div class="hero-slide hero-brand-slide active">
@@ -271,15 +271,10 @@
<ul>
<li><a href="pages/about.html#haiguji">公司简介</a></li>
<li><a href="pages/about.html#contact">联系我们</a></li>
<li><a href="pages/about.html#privacy">隐私协议</a></li>
<li><a href="pages/about.html#partners">合作伙伴</a></li>
</ul>
</div>
<div class="footer-section footer-section-partners">
<h3>合作伙伴</h3>
<a class="footer-partners-link" href="pages/about.html#partners">查看全部合作伙伴 →</a>
</div>
<div class="footer-section">
<h3>关注我们</h3>
<div class="qr-grid">
@@ -292,7 +287,7 @@
<div class="footer-bottom">
<p>&copy; 2024 三亚海古纪生物科技有限公司. 保留所有权利。</p>
<p><a href="#">隐私政策</a> | <a href="#">用户协议</a></p>
<p><a href="pages/about.html#privacy">隐私政策</a> | <a href="#">用户协议</a></p>
</div>
</footer>
js/particles.js
+121 -150
View File
@@ -1,29 +1,25 @@
/**
* 深色岩层背景上的粒子网络效果
* 在首页 hero 与各子页面 page-hero 的右下角绘制一片跟随鼠标移动的粒子网络。
* 支持页面中同时存在多个粒子画布（每个画布独立运行，共享全局鼠标位置）。
* 全站深色岩层背景上的粒子网络效果
* 固定在视口内（position: fixed），任意页面、任意滚动位置都可见，跟随鼠标移动。
*/
(function () {
var canvases = document.querySelectorAll('.hero-particles, .page-hero-particles');
if (!canvases.length) return;
var canvas = document.querySelector('.site-particles');
if (!canvas) return;
var ctx = canvas.getContext('2d');
var DPR = window.devicePixelRatio || 1;
var prefersReducedMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
var globalMouse = { clientX: null, clientY: null, active: false };
document.addEventListener('mousemove', function (e) {
globalMouse.clientX = e.clientX;
globalMouse.clientY = e.clientY;
globalMouse.active = true;
});
document.addEventListener('mouseleave', function () { globalMouse.active = false; });
var width = 0;
var height = 0;
var particles = [];
var mouse = { x: null, y: null, active: false };
var config = {
density: 7000, // 每 7000 平方像素一个粒子（比之前更密一些）
maxParticles: 110,
density: 9000,
maxParticles: 130,
linkDistance: 150,
mouseLinkDistance: 210,
mouseLinkDistance: 220,
mouseForce: 1.1,
dotRadiusMin: 1.6,
dotRadiusMax: 3.4,
@@ -31,150 +27,125 @@
lineColor: '56, 189, 248'
};
canvases.forEach(function (canvas) {
initCanvas(canvas);
function resize() {
width = window.innerWidth;
height = window.innerHeight;
canvas.width = Math.max(1, Math.round(width * DPR));
canvas.height = Math.max(1, Math.round(height * DPR));
ctx.setTransform(DPR, 0, 0, DPR, 0, 0);
createParticles();
}
function createParticles() {
var count = Math.min(config.maxParticles, Math.floor((width * height) / config.density));
particles = new Array(Math.max(count, 30)).fill(null).map(function () {
return {
x: Math.random() * width,
y: Math.random() * height,
vx: (Math.random() - 0.5) * 0.4,
vy: (Math.random() - 0.5) * 0.4,
r: Math.random() * (config.dotRadiusMax - config.dotRadiusMin) + config.dotRadiusMin
};
});
}
document.addEventListener('mousemove', function (e) {
mouse.x = e.clientX;
mouse.y = e.clientY;
mouse.active = true;
});
document.addEventListener('mouseleave', function () { mouse.active = false; });
function initCanvas(canvas) {
var ctx = canvas.getContext('2d');
var width = 0;
var height = 0;
var particles = [];
var mouse = { x: null, y: null, active: false };
function step() {
particles.forEach(function (p) {
p.x += p.vx;
p.y += p.vy;
function resize() {
var rect = canvas.getBoundingClientRect();
width = rect.width;
height = rect.height;
canvas.width = Math.max(1, Math.round(width * DPR));
canvas.height = Math.max(1, Math.round(height * DPR));
ctx.setTransform(DPR, 0, 0, DPR, 0, 0);
createParticles();
}
if (p.x <= 0 || p.x >= width) p.vx *= -1;
if (p.y <= 0 || p.y >= height) p.vy *= -1;
function createParticles() {
var count = Math.min(config.maxParticles, Math.floor((width * height) / config.density));
particles = new Array(Math.max(count, 24)).fill(null).map(function () {
return {
x: Math.random() * width,
y: Math.random() * height,
vx: (Math.random() - 0.5) * 0.4,
vy: (Math.random() - 0.5) * 0.4,
r: Math.random() * (config.dotRadiusMax - config.dotRadiusMin) + config.dotRadiusMin
};
});
}
function updateLocalMouse() {
if (!globalMouse.active || globalMouse.clientX === null) {
mouse.active = false;
return;
}
var rect = canvas.getBoundingClientRect();
var x = globalMouse.clientX - rect.left;
var y = globalMouse.clientY - rect.top;
var margin = 200;
if (x > -margin && x < width + margin && y > -margin && y < height + margin) {
mouse.x = Math.max(0, Math.min(width, x));
mouse.y = Math.max(0, Math.min(height, y));
mouse.active = true;
} else {
mouse.active = false;
}
}
function step() {
particles.forEach(function (p) {
p.x += p.vx;
p.y += p.vy;
if (p.x <= 0 || p.x >= width) p.vx *= -1;
if (p.y <= 0 || p.y >= height) p.vy *= -1;
p.x = Math.max(0, Math.min(width, p.x));
p.y = Math.max(0, Math.min(height, p.y));
if (mouse.active) {
var dx = mouse.x - p.x;
var dy = mouse.y - p.y;
var dist = Math.hypot(dx, dy);
if (dist < config.mouseLinkDistance && dist > 0.001) {
var pull = (1 - dist / config.mouseLinkDistance) * config.mouseForce;
p.x -= (dx / dist) * pull;
p.y -= (dy / dist) * pull;
}
}
});
}
function render() {
ctx.clearRect(0, 0, width, height);
for (var i = 0; i < particles.length; i++) {
for (var j = i + 1; j < particles.length; j++) {
var dx = particles[i].x - particles[j].x;
var dy = particles[i].y - particles[j].y;
var dist = Math.hypot(dx, dy);
if (dist < config.linkDistance) {
ctx.strokeStyle = 'rgba(' + config.lineColor + ', ' + ((1 - dist / config.linkDistance) * 0.5) + ')';
ctx.lineWidth = 0.7;
ctx.beginPath();
ctx.moveTo(particles[i].x, particles[i].y);
ctx.lineTo(particles[j].x, particles[j].y);
ctx.stroke();
}
}
if (mouse.active) {
var mdx = particles[i].x - mouse.x;
var mdy = particles[i].y - mouse.y;
var mdist = Math.hypot(mdx, mdy);
if (mdist < config.mouseLinkDistance) {
ctx.strokeStyle = 'rgba(' + config.lineColor + ', ' + ((1 - mdist / config.mouseLinkDistance) * 0.7) + ')';
ctx.lineWidth = 0.9;
ctx.beginPath();
ctx.moveTo(particles[i].x, particles[i].y);
ctx.lineTo(mouse.x, mouse.y);
ctx.stroke();
}
}
}
particles.forEach(function (p) {
ctx.beginPath();
ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2);
ctx.fillStyle = 'rgba(' + config.dotColor + ', 0.9)';
ctx.shadowColor = 'rgba(56, 189, 248, 0.85)';
ctx.shadowBlur = 7;
ctx.fill();
ctx.shadowBlur = 0;
});
p.x = Math.max(0, Math.min(width, p.x));
p.y = Math.max(0, Math.min(height, p.y));
if (mouse.active) {
ctx.beginPath();
ctx.arc(mouse.x, mouse.y, 2.6, 0, Math.PI * 2);
ctx.fillStyle = 'rgba(255, 255, 255, 0.9)';
ctx.shadowColor = 'rgba(255, 255, 255, 0.9)';
ctx.shadowBlur = 12;
ctx.fill();
ctx.shadowBlur = 0;
var dx = mouse.x - p.x;
var dy = mouse.y - p.y;
var dist = Math.hypot(dx, dy);
if (dist < config.mouseLinkDistance && dist > 0.001) {
var pull = (1 - dist / config.mouseLinkDistance) * config.mouseForce;
p.x -= (dx / dist) * pull;
p.y -= (dy / dist) * pull;
}
}
});
}
function render() {
ctx.clearRect(0, 0, width, height);
for (var i = 0; i < particles.length; i++) {
for (var j = i + 1; j < particles.length; j++) {
var dx = particles[i].x - particles[j].x;
var dy = particles[i].y - particles[j].y;
var dist = Math.hypot(dx, dy);
if (dist < config.linkDistance) {
ctx.strokeStyle = 'rgba(' + config.lineColor + ', ' + ((1 - dist / config.linkDistance) * 0.45) + ')';
ctx.lineWidth = 0.7;
ctx.beginPath();
ctx.moveTo(particles[i].x, particles[i].y);
ctx.lineTo(particles[j].x, particles[j].y);
ctx.stroke();
}
}
if (mouse.active) {
var mdx = particles[i].x - mouse.x;
var mdy = particles[i].y - mouse.y;
var mdist = Math.hypot(mdx, mdy);
if (mdist < config.mouseLinkDistance) {
ctx.strokeStyle = 'rgba(' + config.lineColor + ', ' + ((1 - mdist / config.mouseLinkDistance) * 0.65) + ')';
ctx.lineWidth = 0.9;
ctx.beginPath();
ctx.moveTo(particles[i].x, particles[i].y);
ctx.lineTo(mouse.x, mouse.y);
ctx.stroke();
}
}
}
function loop() {
updateLocalMouse();
step();
render();
requestAnimationFrame(loop);
}
particles.forEach(function (p) {
ctx.beginPath();
ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2);
ctx.fillStyle = 'rgba(' + config.dotColor + ', 0.85)';
ctx.shadowColor = 'rgba(56, 189, 248, 0.8)';
ctx.shadowBlur = 7;
ctx.fill();
ctx.shadowBlur = 0;
});
window.addEventListener('resize', resize);
resize();
if (!prefersReducedMotion) {
loop();
} else {
render();
if (mouse.active) {
ctx.beginPath();
ctx.arc(mouse.x, mouse.y, 2.6, 0, Math.PI * 2);
ctx.fillStyle = 'rgba(255, 255, 255, 0.85)';
ctx.shadowColor = 'rgba(255, 255, 255, 0.85)';
ctx.shadowBlur = 12;
ctx.fill();
ctx.shadowBlur = 0;
}
}
function loop() {
step();
render();
requestAnimationFrame(loop);
}
window.addEventListener('resize', resize);
resize();
if (!prefersReducedMotion) {
loop();
} else {
render();
}
})();
pages/about.html
+3 -7
View File
@@ -13,6 +13,7 @@
</head>
<body>
<canvas class="site-particles" aria-hidden="true"></canvas>
<!-- 导航栏 -->
<nav class="navbar">
<div class="nav-container">
@@ -93,7 +94,6 @@
<!-- 顶部大图 -->
<section class="page-hero">
<canvas class="page-hero-particles" aria-hidden="true"></canvas>
<div class="page-hero-content">
<h1>关于我们</h1>
<p>精准基因组学，引领生物技术未来</p>
@@ -396,15 +396,10 @@
<ul>
<li><a href="#haiguji">公司简介</a></li>
<li><a href="#contact">联系我们</a></li>
<li><a href="#privacy">隐私协议</a></li>
<li><a href="#partners">合作伙伴</a></li>
</ul>
</div>
<div class="footer-section footer-section-partners">
<h3>合作伙伴</h3>
<a class="footer-partners-link" href="about.html#partners">查看全部合作伙伴 →</a>
</div>
<div class="footer-section">
<h3>关注我们</h3>
<div class="qr-grid">
@@ -417,6 +412,7 @@
<div class="footer-bottom">
<p>&copy; 2024 三亚海古纪生物科技有限公司. 保留所有权利。</p>
<p><a href="#privacy">隐私政策</a> | <a href="#">用户协议</a></p>
</div>
</footer>
pages/advantages.html
+3 -7
View File
@@ -12,6 +12,7 @@
</head>
<body>
<canvas class="site-particles" aria-hidden="true"></canvas>
<!-- 导航栏 -->
<nav class="navbar">
<div class="nav-container">
@@ -92,7 +93,6 @@
<!-- 顶部大图 -->
<section class="page-hero">
<canvas class="page-hero-particles" aria-hidden="true"></canvas>
<div class="page-hero-content">
<h1>综合优势</h1>
<p>业界领先的多平台集成解决方案</p>
@@ -272,15 +272,10 @@
<ul>
<li><a href="about.html#haiguji">公司简介</a></li>
<li><a href="about.html#contact">联系我们</a></li>
<li><a href="about.html#privacy">隐私协议</a></li>
<li><a href="about.html#partners">合作伙伴</a></li>
</ul>
</div>
<div class="footer-section footer-section-partners">
<h3>合作伙伴</h3>
<a class="footer-partners-link" href="about.html#partners">查看全部合作伙伴 →</a>
</div>
<div class="footer-section">
<h3>关注我们</h3>
<div class="qr-grid">
@@ -293,6 +288,7 @@
<div class="footer-bottom">
<p>&copy; 2024 三亚海古纪生物科技有限公司. 保留所有权利。</p>
<p><a href="about.html#privacy">隐私政策</a> | <a href="#">用户协议</a></p>
</div>
</footer>
pages/applications.html
+3 -7
View File
@@ -12,6 +12,7 @@
</head>
<body>
<canvas class="site-particles" aria-hidden="true"></canvas>
<!-- 导航栏 -->
<nav class="navbar">
<div class="nav-container">
@@ -92,7 +93,6 @@
<!-- 顶部大图 -->
<section class="page-hero">
<canvas class="page-hero-particles" aria-hidden="true"></canvas>
<div class="page-hero-content">
<h1>应用领域</h1>
<p>基因组学技术在多个领域的创新应用</p>
@@ -219,15 +219,10 @@
<ul>
<li><a href="about.html#haiguji">公司简介</a></li>
<li><a href="about.html#contact">联系我们</a></li>
<li><a href="about.html#privacy">隐私协议</a></li>
<li><a href="about.html#partners">合作伙伴</a></li>
</ul>
</div>
<div class="footer-section footer-section-partners">
<h3>合作伙伴</h3>
<a class="footer-partners-link" href="about.html#partners">查看全部合作伙伴 →</a>
</div>
<div class="footer-section">
<h3>关注我们</h3>
<div class="qr-grid">
@@ -240,6 +235,7 @@
<div class="footer-bottom">
<p>&copy; 2024 三亚海古纪生物科技有限公司. 保留所有权利。</p>
<p><a href="about.html#privacy">隐私政策</a> | <a href="#">用户协议</a></p>
</div>
</footer>
pages/customer-service.html
+1 -1
View File
@@ -12,6 +12,7 @@
</head>
<body>
<canvas class="site-particles" aria-hidden="true"></canvas>
<nav class="navbar">
<div class="nav-container">
<div class="logo-section">
@@ -43,7 +44,6 @@
</nav>
<section class="page-hero">
<canvas class="page-hero-particles" aria-hidden="true"></canvas>
<div class="page-hero-content">
<h1>瀹㈡埛鏈嶅姟绯荤粺</h1>
<p>绯荤粺姝ｅ湪瑙勫垝涓紝褰撳墠椤甸潰淇濈暀璺宠浆鍏ュ彛</p>
pages/products.html
+3 -7
View File
@@ -12,6 +12,7 @@
</head>
<body>
<canvas class="site-particles" aria-hidden="true"></canvas>
<!-- 导航栏 -->
<nav class="navbar">
<div class="nav-container">
@@ -92,7 +93,6 @@
<!-- 顶部大图 -->
<section class="page-hero">
<canvas class="page-hero-particles" aria-hidden="true"></canvas>
<div class="page-hero-content">
<h1>创新产品</h1>
<p>为全球研究者提供先进的基因组学解决方案</p>
@@ -414,15 +414,10 @@
<ul>
<li><a href="about.html#haiguji">公司简介</a></li>
<li><a href="about.html#contact">联系我们</a></li>
<li><a href="about.html#privacy">隐私协议</a></li>
<li><a href="about.html#partners">合作伙伴</a></li>
</ul>
</div>
<div class="footer-section footer-section-partners">
<h3>合作伙伴</h3>
<a class="footer-partners-link" href="about.html#partners">查看全部合作伙伴 →</a>
</div>
<div class="footer-section">
<h3>关注我们</h3>
<div class="qr-grid">
@@ -435,6 +430,7 @@
<div class="footer-bottom">
<p>&copy; 2024 三亚海古纪生物科技有限公司. 保留所有权利。</p>
<p><a href="about.html#privacy">隐私政策</a> | <a href="#">用户协议</a></p>
</div>
</footer>
pages/resources.html
+3 -7
View File
@@ -13,6 +13,7 @@
</head>
<body>
<canvas class="site-particles" aria-hidden="true"></canvas>
<!-- 导航栏 -->
<nav class="navbar">
<div class="nav-container">
@@ -93,7 +94,6 @@
<!-- 顶部大图 -->
<section class="page-hero">
<canvas class="page-hero-particles" aria-hidden="true"></canvas>
<div class="page-hero-content">
<h1>资源中心</h1>
<p>学术成果、案例精选、视频教程</p>
@@ -436,15 +436,10 @@
<ul>
<li><a href="about.html#haiguji">公司简介</a></li>
<li><a href="about.html#contact">联系我们</a></li>
<li><a href="about.html#privacy">隐私协议</a></li>
<li><a href="about.html#partners">合作伙伴</a></li>
</ul>
</div>
<div class="footer-section footer-section-partners">
<h3>合作伙伴</h3>
<a class="footer-partners-link" href="about.html#partners">查看全部合作伙伴 →</a>
</div>
<div class="footer-section">
<h3>关注我们</h3>
<div class="qr-grid">
@@ -457,6 +452,7 @@
<div class="footer-bottom">
<p>&copy; 2024 三亚海古纪生物科技有限公司. 保留所有权利。</p>
<p><a href="about.html#privacy">隐私政策</a> | <a href="#">用户协议</a></p>
</div>
</footer>
pages/services.html
+3 -7
View File
@@ -12,6 +12,7 @@
</head>
<body>
<canvas class="site-particles" aria-hidden="true"></canvas>
<!-- 导航栏 -->
<nav class="navbar">
<div class="nav-container">
@@ -92,7 +93,6 @@
<!-- 顶部大图 -->
<section class="page-hero">
<canvas class="page-hero-particles" aria-hidden="true"></canvas>
<div class="page-hero-content">
<h1>测序与分析服务</h1>
<p>从样品到数据，提供一站式基因组学解决方案</p>
@@ -688,15 +688,10 @@
<ul>
<li><a href="about.html#haiguji">公司简介</a></li>
<li><a href="about.html#contact">联系我们</a></li>
<li><a href="about.html#privacy">隐私协议</a></li>
<li><a href="about.html#partners">合作伙伴</a></li>
</ul>
</div>
<div class="footer-section footer-section-partners">
<h3>合作伙伴</h3>
<a class="footer-partners-link" href="about.html#partners">查看全部合作伙伴 →</a>
</div>
<div class="footer-section">
<h3>关注我们</h3>
<div class="qr-grid">
@@ -709,6 +704,7 @@
<div class="footer-bottom">
<p>&copy; 2024 三亚海古纪生物科技有限公司. 保留所有权利。</p>
<p><a href="about.html#privacy">隐私政策</a> | <a href="#">用户协议</a></p>
</div>
</footer>