yunzerwebsite/yunzerwebsiteallinone
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化企业网站功能

Browse Source
This commit is contained in:
hero920103
2026-08-20 16:21:07 +08:00
parent 112d60b993
commit 3f0fcb88e7
45 changed files with 8758 additions and 5058 deletions
Download Patch File Download Diff File Expand all files Collapse all files
go/themes/theme1/about.html
+196
View File
@@ -0,0 +1,196 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="description" content="{yz:description}" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<title>{yz:sitename}</title>
<link rel="shortcut icon" href="{yz:ico}" type="image/svg" />
<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="assets/css/lineicons.css" />
<link rel="stylesheet" href="assets/css/tiny-slider.css" />
<link rel="stylesheet" href="assets/css/glightbox.min.css" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<section class="navbar-area navbar-nine">
<div class="container">
<div class="row">
<div class="col-lg-12">
<nav class="navbar navbar-expand-lg">
<a class="navbar-brand" href="/">
<img src="{yz:logo}" alt="{yz:sitename}" />
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNine"
aria-controls="navbarNine" aria-expanded="false" aria-label="切换导航">
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
</button>
<div class="collapse navbar-collapse sub-menu-bar" id="navbarNine">
<ul class="navbar-nav me-auto">
<li class="nav-item"><a href="/">主页</a></li>
{yz:nav}
<li class="nav-item">
<a href="[field:url/]">[field:name/]</a>
[field:children/]
</li>
{/yz:nav}
</ul>
</div>
<div class="navbar-btn d-none d-lg-inline-block">
<a class="menu-bar" href="#side-menu-left"><i class="lni lni-menu"></i></a>
</div>
</nav>
</div>
</div>
</div>
</section>
<div class="sidebar-left">
<div class="sidebar-close"><a class="close" href="#close"><i class="lni lni-close"></i></a></div>
<div class="sidebar-content">
<div class="sidebar-logo"><a href="/"><img src="{yz:logo}" alt="{yz:sitename}" /></a></div>
<p class="text">{yz:description}</p>
<div class="sidebar-menu">
<h5 class="menu-title">快速链接</h5>
<ul>
{yz:nav}
<li><a href="[field:url/]">[field:name/]</a></li>
{/yz:nav}
</ul>
</div>
<div class="sidebar-social align-items-center justify-content-center">
<h5 class="social-title">关注我们</h5>
<ul>
<li><a href="javascript:void(0)"><i class="lni lni-facebook-filled"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-twitter-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-linkedin-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-youtube"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="overlay-left"></div>
<section class="about-five page-inner-page">
<div class="article-detail-breadcrumb-wrap">
<div class="container">
<div class="row">
<div class="col-12">
<nav aria-label="breadcrumb">
<ol class="breadcrumb article-detail-breadcrumb">
<li class="breadcrumb-item"><a href="/">主页</a></li>
<li class="breadcrumb-item active" aria-current="page">关于我们</li>
</ol>
</nav>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6 order-lg-2 order-1">
<div class="about-image-five">
<img src="assets/images/about/about-img1.jpg" alt="关于我们" />
</div>
</div>
<div class="col-lg-6 order-lg-1 order-2">
<div class="about-five-content">
<h6 class="small-title">{yz:companyname}</h6>
<h2 class="main-title fw-bold">关于我们</h2>
<div class="onepage-content">
{yz:onepage path="about"/}
{yz:companyintroduction}
</div>
</div>
</div>
</div>
</div>
</section>
<footer class="footer-area footer-eleven">
<div class="footer-top">
<div class="container">
<div class="inner-content">
<div class="row">
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget f-about">
<div class="logo"><a href="/"><img src="{yz:logo}" alt="{yz:sitename}" class="img-fluid" /></a></div>
<p>{yz:description}</p>
<p class="copyright-text">
<span>备案号:{yz:icp}<br>{yz:copyright}&nbsp;&nbsp;<a href="www.yunzer.cn" rel="nofollow"> 云泽网 </a></span>
</p>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>解决方案</h5>
<ul>
<li><a href="javascript:void(0)">市场营销</a></li>
<li><a href="javascript:void(0)">数据分析</a></li>
<li><a href="javascript:void(0)">电子商务</a></li>
<li><a href="javascript:void(0)">商业洞察</a></li>
</ul>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>技术支持</h5>
<ul>
<li><a href="javascript:void(0)">价格方案</a></li>
<li><a href="javascript:void(0)">开发文档</a></li>
<li><a href="javascript:void(0)">使用指南</a></li>
<li><a href="javascript:void(0)">API 状态</a></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget newsletter">
<h5>订阅我们</h5>
<p>订阅我们，获取最新资讯</p>
<form action="#" method="get" target="_blank" class="newsletter-form">
<input name="EMAIL" placeholder="邮箱地址" required="required" type="email" />
<div class="button"><button class="sub-btn"><i class="lni lni-envelope"></i></button></div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
<a href="#" class="scroll-top btn-hover"><i class="lni lni-chevron-up"></i></a>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/glightbox.min.js"></script>
<script src="assets/js/main.js"></script>
<script src="assets/js/tiny-slider.js"></script>
<script>
document.querySelector(".navbar-nine .navbar-toggler").addEventListener("click", function () {
this.classList.toggle("active");
});
var sidebarLeft = document.querySelector(".sidebar-left");
var overlayLeft = document.querySelector(".overlay-left");
overlayLeft.addEventListener("click", function () {
sidebarLeft.classList.toggle("open");
overlayLeft.classList.toggle("open");
});
document.querySelector(".sidebar-close .close").addEventListener("click", function () {
sidebarLeft.classList.remove("open");
overlayLeft.classList.remove("open");
});
document.querySelector(".navbar-nine .menu-bar").addEventListener("click", function () {
sidebarLeft.classList.add("open");
overlayLeft.classList.add("open");
});
</script>
</body>
</html>
go/themes/theme1/assets/js/main.js
+19 -5
View File
@@ -24,7 +24,7 @@
}
};
// section menu active
// section menu active（仅处理页内锚点）
function onScroll(event) {
var sections = document.querySelectorAll('.page-scroll');
var scrollPos = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
@@ -32,10 +32,16 @@
for (var i = 0; i < sections.length; i++) {
var currLink = sections[i];
var val = currLink.getAttribute('href');
if (!val || val.charAt(0) !== '#') {
continue;
}
var refElement = document.querySelector(val);
if (!refElement) {
continue;
}
var scrollTopMinus = scrollPos + 73;
if (refElement.offsetTop <= scrollTopMinus && (refElement.offsetTop + refElement.offsetHeight > scrollTopMinus)) {
document.querySelector('.page-scroll').classList.remove('active');
sections.forEach(function (link) { link.classList.remove('active'); });
currLink.classList.add('active');
} else {
currLink.classList.remove('active');
@@ -45,15 +51,23 @@
window.document.addEventListener('scroll', onScroll);
// for menu scroll
// 仅页内锚点（#xxx）平滑滚动；/news、/ 等路由链接正常跳转
var pageLink = document.querySelectorAll('.page-scroll');
pageLink.forEach(elem => {
elem.addEventListener('click', e => {
var href = elem.getAttribute('href');
if (!href || href.charAt(0) !== '#') {
return;
}
var target = document.querySelector(href);
if (!target) {
return;
}
e.preventDefault();
document.querySelector(elem.getAttribute('href')).scrollIntoView({
target.scrollIntoView({
behavior: 'smooth',
offsetTop: 1 - 60,
block: 'start',
});
});
});
go/themes/theme1/contact.html
+260
View File
@@ -0,0 +1,260 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="description" content="{yz:description}" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<title>{yz:sitename}</title>
<link rel="shortcut icon" href="{yz:ico}" type="image/svg" />
<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="assets/css/lineicons.css" />
<link rel="stylesheet" href="assets/css/tiny-slider.css" />
<link rel="stylesheet" href="assets/css/glightbox.min.css" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<section class="navbar-area navbar-nine">
<div class="container">
<div class="row">
<div class="col-lg-12">
<nav class="navbar navbar-expand-lg">
<a class="navbar-brand" href="/">
<img src="{yz:logo}" alt="{yz:sitename}" />
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNine"
aria-controls="navbarNine" aria-expanded="false" aria-label="切换导航">
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
</button>
<div class="collapse navbar-collapse sub-menu-bar" id="navbarNine">
<ul class="navbar-nav me-auto">
<li class="nav-item"><a href="/">主页</a></li>
{yz:nav}
<li class="nav-item">
<a href="[field:url/]">[field:name/]</a>
[field:children/]
</li>
{/yz:nav}
</ul>
</div>
<div class="navbar-btn d-none d-lg-inline-block">
<a class="menu-bar" href="#side-menu-left"><i class="lni lni-menu"></i></a>
</div>
</nav>
</div>
</div>
</div>
</section>
<div class="sidebar-left">
<div class="sidebar-close"><a class="close" href="#close"><i class="lni lni-close"></i></a></div>
<div class="sidebar-content">
<div class="sidebar-logo"><a href="/"><img src="{yz:logo}" alt="{yz:sitename}" /></a></div>
<p class="text">{yz:description}</p>
<div class="sidebar-menu">
<h5 class="menu-title">快速链接</h5>
<ul>
{yz:nav}
<li><a href="[field:url/]">[field:name/]</a></li>
{/yz:nav}
</ul>
</div>
<div class="sidebar-social align-items-center justify-content-center">
<h5 class="social-title">关注我们</h5>
<ul>
<li><a href="javascript:void(0)"><i class="lni lni-facebook-filled"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-twitter-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-linkedin-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-youtube"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="overlay-left"></div>
<section id="contact" class="contact-section page-inner-page">
<div class="article-detail-breadcrumb-wrap">
<div class="container">
<div class="row">
<div class="col-12">
<nav aria-label="breadcrumb">
<ol class="breadcrumb article-detail-breadcrumb">
<li class="breadcrumb-item"><a href="/">主页</a></li>
<li class="breadcrumb-item active" aria-current="page">联系我们</li>
</ol>
</nav>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-xl-4">
<div class="contact-item-wrapper">
<div class="row">
<div class="col-12 col-md-6 col-xl-12">
<div class="contact-item">
<div class="contact-icon"><i class="lni lni-phone"></i></div>
<div class="contact-content">
<h4>联系方式</h4>
<p>{yz:phone}</p>
<p>{yz:email}</p>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-xl-12">
<div class="contact-item">
<div class="contact-icon"><i class="lni lni-map-marker"></i></div>
<div class="contact-content">
<h4>公司地址</h4>
<p>{yz:address}</p>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-xl-12">
<div class="contact-item">
<div class="contact-icon"><i class="lni lni-alarm-clock"></i></div>
<div class="contact-content">
<h4>营业时间</h4>
<p>{yz:worktime}</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-8">
<div class="contact-form-wrapper">
<div class="row">
<div class="col-xl-10 col-lg-8 mx-auto">
<div class="section-title text-center">
<span>联系我们</span>
<h2>准备开始吧！</h2>
</div>
</div>
</div>
<div class="onepage-content contact-page-content">
{yz:onepage path="contact"/}
</div>
<form action="#" class="contact-form">
<div class="row">
<div class="col-md-6">
<input type="text" name="name" id="name" placeholder="姓名" required />
</div>
<div class="col-md-6">
<input type="email" name="email" id="email" placeholder="邮箱" required />
</div>
</div>
<div class="row">
<div class="col-md-6">
<input type="text" name="phone" id="phone" placeholder="手机号" required />
</div>
<div class="col-md-6">
<input type="text" name="title" id="title" placeholder="标题" required />
</div>
</div>
<div class="row">
<div class="col-12">
<textarea name="message" id="message" placeholder="请输入内容" rows="5"></textarea>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="button text-center rounded-buttons">
<button type="submit" class="btn primary-btn rounded-full">发送</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<footer class="footer-area footer-eleven">
<div class="footer-top">
<div class="container">
<div class="inner-content">
<div class="row">
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget f-about">
<div class="logo"><a href="/"><img src="{yz:logo}" alt="{yz:sitename}" class="img-fluid" /></a></div>
<p>{yz:description}</p>
<p class="copyright-text">
<span>备案号:{yz:icp}<br>{yz:copyright}&nbsp;&nbsp;<a href="www.yunzer.cn" rel="nofollow"> 云泽网 </a></span>
</p>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>解决方案</h5>
<ul>
<li><a href="javascript:void(0)">市场营销</a></li>
<li><a href="javascript:void(0)">数据分析</a></li>
<li><a href="javascript:void(0)">电子商务</a></li>
<li><a href="javascript:void(0)">商业洞察</a></li>
</ul>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>技术支持</h5>
<ul>
<li><a href="javascript:void(0)">价格方案</a></li>
<li><a href="javascript:void(0)">开发文档</a></li>
<li><a href="javascript:void(0)">使用指南</a></li>
<li><a href="javascript:void(0)">API 状态</a></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget newsletter">
<h5>订阅我们</h5>
<p>订阅我们，获取最新资讯</p>
<form action="#" method="get" target="_blank" class="newsletter-form">
<input name="EMAIL" placeholder="邮箱地址" required="required" type="email" />
<div class="button"><button class="sub-btn"><i class="lni lni-envelope"></i></button></div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
<a href="#" class="scroll-top btn-hover"><i class="lni lni-chevron-up"></i></a>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/glightbox.min.js"></script>
<script src="assets/js/main.js"></script>
<script src="assets/js/tiny-slider.js"></script>
<script>
document.querySelector(".navbar-nine .navbar-toggler").addEventListener("click", function () {
this.classList.toggle("active");
});
var sidebarLeft = document.querySelector(".sidebar-left");
var overlayLeft = document.querySelector(".overlay-left");
overlayLeft.addEventListener("click", function () {
sidebarLeft.classList.toggle("open");
overlayLeft.classList.toggle("open");
});
document.querySelector(".sidebar-close .close").addEventListener("click", function () {
sidebarLeft.classList.remove("open");
overlayLeft.classList.remove("open");
});
document.querySelector(".navbar-nine .menu-bar").addEventListener("click", function () {
sidebarLeft.classList.add("open");
overlayLeft.classList.add("open");
});
</script>
</body>
</html>
go/themes/theme1/index.html
+119 -404
View File
@@ -5,11 +5,11 @@
<!--====== 必需的元标签 ======-->
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="description" content="云泽网 - 数字化解决方案与商业服务" />
<meta name="description" content="{yz:description}" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<!--====== 标题 ======-->
<title>云泽网 - {yz:sitename}</title>
<title>{yz:sitename}</title>
<!--====== 网站图标 ======-->
<link rel="shortcut icon" href="{yz:ico}" type="image/svg" />
@@ -38,7 +38,7 @@
<div class="row">
<div class="col-lg-12">
<nav class="navbar navbar-expand-lg">
<a class="navbar-brand" href="index.html">
<a class="navbar-brand" href="/">
<img src="{yz:logo}" alt="{yz:sitename}" />
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNine"
@@ -51,11 +51,11 @@
<div class="collapse navbar-collapse sub-menu-bar" id="navbarNine">
<ul class="navbar-nav me-auto">
<li class="nav-item">
<a class="page-scroll" href="/">主页</a>
<a href="/">主页</a>
</li>
{yz:nav}
<li class="nav-item">
<a class="page-scroll" href="[field:url/]">[field:name/]</a>
<a href="[field:url/]">[field:name/]</a>
[field:children/]
</li>
{/yz:nav}
@@ -84,17 +84,16 @@
</div>
<div class="sidebar-content">
<div class="sidebar-logo">
<a href="index.html"><img src="assets/images/logo.svg" alt="云泽网" /></a>
<a href="/"><img src="{yz:logo}" alt="{yz:sitename}" /></a>
</div>
<p class="text">我们致力于为品牌提供卓越的数字解决方案，用技术创造无限可能。</p>
<p class="text">{yz:description}</p>
<!-- logo -->
<div class="sidebar-menu">
<h5 class="menu-title">快速链接</h5>
<ul>
<li><a href="javascript:void(0)">关于我们</a></li>
<li><a href="javascript:void(0)">我们的团队</a></li>
<li><a href="javascript:void(0)">最新动态</a></li>
<li><a href="javascript:void(0)">联系我们</a></li>
{yz:nav}
<li><a href="[field:url/]">[field:name/]</a></li>
{/yz:nav}
</ul>
</div>
<!-- menu -->
@@ -148,137 +147,48 @@
</section>
<!-- 头部区域 结束 -->
<!--====== 关于我们 开始 ======-->
<!--====== 新闻中心 开始 ======-->
<section class="about-area about-five">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6 col-12">
<div class="about-image-five">
<svg class="shape" width="106" height="134" viewBox="0 0 106 134" fill="none"
xmlns="http://www.w3.org/2000/svg">
<circle cx="1.66654" cy="1.66679" r="1.66667" fill="#DADADA" />
<circle cx="1.66654" cy="16.3335" r="1.66667" fill="#DADADA" />
<circle cx="1.66654" cy="31.0001" r="1.66667" fill="#DADADA" />
<circle cx="1.66654" cy="45.6668" r="1.66667" fill="#DADADA" />
<circle cx="1.66654" cy="60.3335" r="1.66667" fill="#DADADA" />
<circle cx="1.66654" cy="88.6668" r="1.66667" fill="#DADADA" />
<circle cx="1.66654" cy="117.667" r="1.66667" fill="#DADADA" />
<circle cx="1.66654" cy="74.6668" r="1.66667" fill="#DADADA" />
<circle cx="1.66654" cy="103" r="1.66667" fill="#DADADA" />
<circle cx="1.66654" cy="132" r="1.66667" fill="#DADADA" />
<circle cx="16.3333" cy="1.66679" r="1.66667" fill="#DADADA" />
<circle cx="16.3333" cy="16.3335" r="1.66667" fill="#DADADA" />
<circle cx="16.3333" cy="31.0001" r="1.66667" fill="#DADADA" />
<circle cx="16.3333" cy="45.6668" r="1.66667" fill="#DADADA" />
<circle cx="16.333" cy="60.3335" r="1.66667" fill="#DADADA" />
<circle cx="16.333" cy="88.6668" r="1.66667" fill="#DADADA" />
<circle cx="16.333" cy="117.667" r="1.66667" fill="#DADADA" />
<circle cx="16.333" cy="74.6668" r="1.66667" fill="#DADADA" />
<circle cx="16.333" cy="103" r="1.66667" fill="#DADADA" />
<circle cx="16.333" cy="132" r="1.66667" fill="#DADADA" />
<circle cx="30.9998" cy="1.66679" r="1.66667" fill="#DADADA" />
<circle cx="74.6665" cy="1.66679" r="1.66667" fill="#DADADA" />
<circle cx="30.9998" cy="16.3335" r="1.66667" fill="#DADADA" />
<circle cx="74.6665" cy="16.3335" r="1.66667" fill="#DADADA" />
<circle cx="30.9998" cy="31.0001" r="1.66667" fill="#DADADA" />
<circle cx="74.6665" cy="31.0001" r="1.66667" fill="#DADADA" />
<circle cx="30.9998" cy="45.6668" r="1.66667" fill="#DADADA" />
<circle cx="74.6665" cy="45.6668" r="1.66667" fill="#DADADA" />
<circle cx="31" cy="60.3335" r="1.66667" fill="#DADADA" />
<circle cx="74.6668" cy="60.3335" r="1.66667" fill="#DADADA" />
<circle cx="31" cy="88.6668" r="1.66667" fill="#DADADA" />
<circle cx="74.6668" cy="88.6668" r="1.66667" fill="#DADADA" />
<circle cx="31" cy="117.667" r="1.66667" fill="#DADADA" />
<circle cx="74.6668" cy="117.667" r="1.66667" fill="#DADADA" />
<circle cx="31" cy="74.6668" r="1.66667" fill="#DADADA" />
<circle cx="74.6668" cy="74.6668" r="1.66667" fill="#DADADA" />
<circle cx="31" cy="103" r="1.66667" fill="#DADADA" />
<circle cx="74.6668" cy="103" r="1.66667" fill="#DADADA" />
<circle cx="31" cy="132" r="1.66667" fill="#DADADA" />
<circle cx="74.6668" cy="132" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="1.66679" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="1.66679" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="16.3335" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="16.3335" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="31.0001" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="31.0001" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="45.6668" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="45.6668" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="60.3335" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="60.3335" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="88.6668" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="88.6668" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="117.667" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="117.667" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="74.6668" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="74.6668" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="103" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="103" r="1.66667" fill="#DADADA" />
<circle cx="45.6665" cy="132" r="1.66667" fill="#DADADA" />
<circle cx="89.3333" cy="132" r="1.66667" fill="#DADADA" />
<circle cx="60.3333" cy="1.66679" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="1.66679" r="1.66667" fill="#DADADA" />
<circle cx="60.3333" cy="16.3335" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="16.3335" r="1.66667" fill="#DADADA" />
<circle cx="60.3333" cy="31.0001" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="31.0001" r="1.66667" fill="#DADADA" />
<circle cx="60.3333" cy="45.6668" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="45.6668" r="1.66667" fill="#DADADA" />
<circle cx="60.333" cy="60.3335" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="60.3335" r="1.66667" fill="#DADADA" />
<circle cx="60.333" cy="88.6668" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="88.6668" r="1.66667" fill="#DADADA" />
<circle cx="60.333" cy="117.667" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="117.667" r="1.66667" fill="#DADADA" />
<circle cx="60.333" cy="74.6668" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="74.6668" r="1.66667" fill="#DADADA" />
<circle cx="60.333" cy="103" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="103" r="1.66667" fill="#DADADA" />
<circle cx="60.333" cy="132" r="1.66667" fill="#DADADA" />
<circle cx="104" cy="132" r="1.66667" fill="#DADADA" />
</svg>
<img src="assets/images/about/about-img1.jpg" alt="关于我们 - 团队与经验" />
</div>
</div>
<div class="col-lg-6 col-12">
<div class="about-five-content">
<h6 class="small-title text-lg">我们的故事</h6>
<h2 class="main-title fw-bold">我们的团队拥有丰富的经验和专业知识</h2>
<div class="about-five-tab">
<nav>
<div class="nav nav-tabs" id="nav-tab" role="tablist">
<button class="nav-link active" id="nav-who-tab" data-bs-toggle="tab" data-bs-target="#nav-who"
type="button" role="tab" aria-controls="nav-who" aria-selected="true">关于我们</button>
<button class="nav-link" id="nav-vision-tab" data-bs-toggle="tab" data-bs-target="#nav-vision"
type="button" role="tab" aria-controls="nav-vision" aria-selected="false">我们的愿景</button>
<button class="nav-link" id="nav-history-tab" data-bs-toggle="tab" data-bs-target="#nav-history"
type="button" role="tab" aria-controls="nav-history" aria-selected="false">发展历程</button>
</div>
</nav>
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-who" role="tabpanel" aria-labelledby="nav-who-tab">
<p>我们相信，优秀的设计和清晰的技术能够塑造品牌的未来。我们专注于提供定制化的数字解决方案，帮助客户在竞争中脱颖而出。</p>
<p>从初创企业到行业巨头，我们与各类品牌合作，通过创新驱动业务增长。我们的团队始终以客户需求为核心，打造兼具美感与功能的产品。</p>
</div>
<div class="tab-pane fade" id="nav-vision" role="tabpanel" aria-labelledby="nav-vision-tab">
<p>我们的愿景是成为数字创新领域的引领者，通过科技赋能商业，让每一个创意都能落地生根，创造真正的社会与商业价值。</p>
<p>我们期待构建一个开放、协作的生态系统，与合作伙伴共同探索未来的可能性，推动行业持续进步。</p>
</div>
<div class="tab-pane fade" id="nav-history" role="tabpanel" aria-labelledby="nav-history-tab">
<p>自成立以来，我们始终秉持匠心精神，不断打磨技术与服务。从第一个项目到如今服务全球客户，每一步都见证着我们的成长与坚持。</p>
<p>我们珍视每一次合作，并将其视为推动自我革新的契机。未来的路，我们期待与更多伙伴携手同行。</p>
</div>
</div>
<section id="news-center" class="news-center-area">
<div class="section-title-five">
<div class="container">
<div class="row">
<div class="col-12">
<div class="content">
<h6>资讯动态</h6>
<h2 class="fw-bold">新闻中心</h2>
<p>了解最新动态、行业资讯与公司公告。</p>
</div>
</div>
</div>
</div>
</div>
<!-- container -->
<div class="container">
{yz:newscenter row="8" titlelen="28"}
<div class="col-lg-3 col-md-6 col-12">
<div class="single-news news-center-item">
<div class="image">
<a href="[field:arcurl/]"><img class="thumb" src="[field:image/]" alt="[field:titlefull/]" onerror="this.style.display='none'" /></a>
<div class="meta-details">
<span>[field:pubdate/]</span>
</div>
</div>
<div class="content-body">
<h4 class="title">
<a href="[field:arcurl/]" title="[field:titlefull/]">[field:title/]</a>
</h4>
<p>[field:desc/]</p>
</div>
</div>
</div>
{/yz:newscenter}
<div class="news-center-more">
<a href="/news" class="btn primary-btn-outline">查看更多</a>
</div>
</div>
</section>
<!--====== 关于我们 结束 ======-->
<!--====== 新闻中心 结束 ======-->
<!-- ===== 服务区域 开始 ===== -->
<section id="services" class="services-area services-eight">
@@ -288,10 +198,10 @@
<div class="row">
<div class="col-12">
<div class="content">
<h6>我们的服务</h6>
<h2 class="fw-bold">核心业务</h2>
<h6>产品中心</h6>
<h2 class="fw-bold">精选产品展示</h2>
<p>
我们提供从策略到执行的全链路服务，助力品牌实现数字化升级。
面向企业数字化运营，提供开箱即用、可持续扩展的产品能力。
</p>
</div>
</div>
@@ -302,84 +212,33 @@
</div>
<!--====== 标题区域 结束 ======-->
<div class="container">
<div class="row">
<div class="row product-showcase-grid">
<div class="col-lg-4 col-md-6">
<div class="single-services">
<div class="service-icon">
<i class="lni lni-capsule"></i>
</div>
<div class="service-content">
<h4>焕新设计</h4>
<p>
以用户为中心，打造兼具视觉冲击与极致体验的界面设计，让品牌形象焕然一新。
</p>
</div>
</div>
<article class="product-showcase-card product-showcase-card--primary">
<div class="product-showcase-icon"><i class="lni lni-dashboard"></i></div>
<span class="product-showcase-tag">运营增长</span>
<h3>企业运营中台</h3>
<p>统一连接客户、业务和数据，帮助团队快速构建可度量的运营闭环。</p>
<a href="#contact" class="product-showcase-link">了解产品 <i class="lni lni-arrow-right"></i></a>
</article>
</div>
<div class="col-lg-4 col-md-6">
<div class="single-services">
<div class="service-icon">
<i class="lni lni-bootstrap"></i>
</div>
<div class="service-content">
<h4>坚实 Bootstrap 5</h4>
<p>
基于最新 Bootstrap 5 框架，确保项目具有出色的响应式布局和稳定的性能表现。
</p>
</div>
</div>
<article class="product-showcase-card">
<div class="product-showcase-icon"><i class="lni lni-layers"></i></div>
<span class="product-showcase-tag">协同办公</span>
<h3>智能协作平台</h3>
<p>聚合任务、审批与知识资产，让跨部门协作清晰有序、高效推进。</p>
<a href="#contact" class="product-showcase-link">了解产品 <i class="lni lni-arrow-right"></i></a>
</article>
</div>
<div class="col-lg-4 col-md-6">
<div class="single-services">
<div class="service-icon">
<i class="lni lni-shortcode"></i>
</div>
<div class="service-content">
<h4>100+ 组件库</h4>
<p>
内置丰富的组件与模块，灵活组合，快速搭建企业级应用与营销页面。
</p>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="single-services">
<div class="service-icon">
<i class="lni lni-dashboard"></i>
</div>
<div class="service-content">
<h4>性能优化</h4>
<p>
从代码到资源加载，全方位优化，确保网站与应用拥有闪电般的访问速度。
</p>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="single-services">
<div class="service-icon">
<i class="lni lni-layers"></i>
</div>
<div class="service-content">
<h4>完全自定义</h4>
<p>
所有设计均支持深度定制，贴合品牌调性与业务需求，拒绝模板化。
</p>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="single-services">
<div class="service-icon">
<i class="lni lni-reload"></i>
</div>
<div class="service-content">
<h4>持续迭代</h4>
<p>
我们提供长期的技术支持与功能更新，保障产品始终与时俱进。
</p>
</div>
</div>
<article class="product-showcase-card">
<div class="product-showcase-icon"><i class="lni lni-bar-chart"></i></div>
<span class="product-showcase-tag">数据洞察</span>
<h3>经营分析系统</h3>
<p>将分散经营数据转化为实时洞察，为每一次关键决策提供可靠依据。</p>
<a href="#contact" class="product-showcase-link">了解产品 <i class="lni lni-arrow-right"></i></a>
</article>
</div>
</div>
</div>
@@ -387,117 +246,71 @@
<!-- ===== 服务区域 结束 ===== -->
<!-- 价格区域 开始 -->
<section id="pricing" class="pricing-area pricing-fourteen">
<!--====== 标题区域 开始 ======-->
<!-- 解决方案区域 开始 -->
<section id="pricing" class="solution-area">
<div class="section-title-five">
<div class="container">
<div class="row">
<div class="col-12">
<div class="content">
<h6>定价方案</h6>
<h2 class="fw-bold">灵活的价格策略</h2>
<h6>解决方案</h6>
<h2 class="fw-bold">适配不同业务场景</h2>
<p>
我们提供多种套餐，满足不同规模企业的需求。所有方案均包含核心功能，无隐藏费用。
从业务诊断到平台落地，为不同阶段、不同规模的企业提供针对性支持。
</p>
</div>
</div>
</div>
<!-- row -->
</div>
<!-- container -->
</div>
<!--====== 标题区域 结束 ======-->
<div class="container">
<div class="row">
<div class="col-lg-4 col-md-6 col-12">
<div class="pricing-style-fourteen">
<div class="table-head">
<h6 class="title">入门版</h4>
<p>适合个人开发者或小型项目，快速起步。</p>
<div class="price">
<h2 class="amount">
<span class="currency">$</span>0<span class="duration">/月 </span>
</h2>
</div>
</div>
<div class="light-rounded-buttons">
<a href="javascript:void(0)" class="btn primary-btn-outline">
免费试用
</a>
</div>
<div class="table-content">
<ul class="table-list">
<li> <i class="lni lni-checkmark-circle"></i> 基础组件使用</li>
<li> <i class="lni lni-checkmark-circle"></i> 社区支持</li>
<li> <i class="lni lni-checkmark-circle deactive"></i> 高级组件库</li>
<li> <i class="lni lni-checkmark-circle deactive"></i> 专属技术支持</li>
</ul>
</div>
</div>
<div class="row g-4">
<div class="col-lg-4">
<article class="solution-showcase-card">
<span class="solution-showcase-index">01</span>
<div class="solution-showcase-icon"><i class="lni lni-briefcase"></i></div>
<h3>中小企业数字化</h3>
<p>以轻量化产品快速梳理业务流程，降低协同和管理成本。</p>
<ul>
<li>业务流程在线化</li>
<li>经营数据可视化</li>
<li>模块化按需启用</li>
</ul>
<a href="#contact" class="solution-showcase-link">咨询方案 <i class="lni lni-arrow-right"></i></a>
</article>
</div>
<div class="col-lg-4 col-md-6 col-12">
<div class="pricing-style-fourteen middle">
<div class="table-head">
<h6 class="title">进阶版</h4>
<p>为成长型企业打造，提供更多扩展功能。</p>
<div class="price">
<h2 class="amount">
<span class="currency">$</span>99<span class="duration">/月 </span>
</h2>
</div>
</div>
<div class="light-rounded-buttons">
<a href="javascript:void(0)" class="btn primary-btn">
免费试用
</a>
</div>
<div class="table-content">
<ul class="table-list">
<li> <i class="lni lni-checkmark-circle"></i> 全组件使用</li>
<li> <i class="lni lni-checkmark-circle"></i> 优先邮件支持</li>
<li> <i class="lni lni-checkmark-circle"></i> 自定义主题</li>
<li> <i class="lni lni-checkmark-circle deactive"></i> 专属客户经理</li>
</ul>
</div>
</div>
<div class="col-lg-4">
<article class="solution-showcase-card solution-showcase-card--featured">
<span class="solution-showcase-index">02</span>
<div class="solution-showcase-icon"><i class="lni lni-network"></i></div>
<h3>集团协同管理</h3>
<p>构建跨组织、跨区域的一体化管理平台，让总部与业务单元高效联动。</p>
<ul>
<li>多组织权限体系</li>
<li>统一业务数据标准</li>
<li>全链路经营管控</li>
</ul>
<a href="#contact" class="solution-showcase-link">咨询方案 <i class="lni lni-arrow-right"></i></a>
</article>
</div>
<div class="col-lg-4 col-md-6 col-12">
<div class="pricing-style-fourteen">
<div class="table-head">
<h6 class="title">尊享版</h4>
<p>面向大型组织，提供全方位定制与专属服务。</p>
<div class="price">
<h2 class="amount">
<span class="currency">$</span>150<span class="duration">/月 </span>
</h2>
</div>
</div>
<div class="light-rounded-buttons">
<a href="javascript:void(0)" class="btn primary-btn-outline">
免费试用
</a>
</div>
<div class="table-content">
<ul class="table-list">
<li> <i class="lni lni-checkmark-circle"></i> 所有高级功能</li>
<li> <i class="lni lni-checkmark-circle"></i> 7x24 技术支持</li>
<li> <i class="lni lni-checkmark-circle"></i> 专属定制开发</li>
<li> <i class="lni lni-checkmark-circle"></i> 战略咨询顾问</li>
</ul>
</div>
</div>
<div class="col-lg-4">
<article class="solution-showcase-card">
<span class="solution-showcase-index">03</span>
<div class="solution-showcase-icon"><i class="lni lni-rocket"></i></div>
<h3>业务增长与创新</h3>
<p>以数据驱动产品迭代和客户运营，持续验证并放大增长机会。</p>
<ul>
<li>客户全生命周期运营</li>
<li>实时指标监测分析</li>
<li>敏捷迭代支持</li>
</ul>
<a href="#contact" class="solution-showcase-link">咨询方案 <i class="lni lni-arrow-right"></i></a>
</article>
</div>
</div>
</div>
</section>
<!--/ 价格区域 结束 -->
<!-- 解决方案区域 结束 -->
@@ -521,103 +334,6 @@
</section>
<!-- 行动号召区域 结束 -->
<!-- 最新动态区域 开始 -->
<div id="blog" class="latest-news-area section">
<!--====== 标题区域 开始 ======-->
<div class="section-title-five">
<div class="container">
<div class="row">
<div class="col-12">
<div class="content">
<h6>最新资讯</h6>
<h2 class="fw-bold">新闻与博客</h2>
<p>
分享行业洞察、技术干货与团队动态，与您一同探索数字世界的边界。
</p>
</div>
</div>
</div>
<!-- row -->
</div>
<!-- container -->
</div>
<!--====== 标题区域 结束 ======-->
<div class="container">
<div class="row">
<div class="col-lg-4 col-md-6 col-12">
<!-- 单篇新闻 -->
<div class="single-news">
<div class="image">
<a href="javascript:void(0)"><img class="thumb" src="assets/images/blog/1.jpg" alt="博客文章" /></a>
<div class="meta-details">
<img class="thumb" src="assets/images/blog/b6.jpg" alt="作者头像" />
<span>作者：张明</span>
</div>
</div>
<div class="content-body">
<h4 class="title">
<a href="javascript:void(0)"> 如何打造设计驱动的团队文化 </a>
</h4>
<p>
设计不仅仅是美学，更是解决问题的思维方式。本文分享了我们在团队中推行设计驱动的实践与经验。
</p>
</div>
</div>
<!-- 单篇新闻结束 -->
</div>
<div class="col-lg-4 col-md-6 col-12">
<!-- 单篇新闻 -->
<div class="single-news">
<div class="image">
<a href="javascript:void(0)"><img class="thumb" src="assets/images/blog/2.jpg" alt="博客文章" /></a>
<div class="meta-details">
<img class="thumb" src="assets/images/blog/b6.jpg" alt="作者头像" />
<span>作者：李薇</span>
</div>
</div>
<div class="content-body">
<h4 class="title">
<a href="javascript:void(0)">
2026 年最值得关注的前端框架
</a>
</h4>
<p>
技术演进日新月异，我们梳理了当前最具潜力与社区活力的前端框架，助你做出更明智的技术选型。
</p>
</div>
</div>
<!-- 单篇新闻结束 -->
</div>
<div class="col-lg-4 col-md-6 col-12">
<!-- 单篇新闻 -->
<div class="single-news">
<div class="image">
<a href="javascript:void(0)"><img class="thumb" src="assets/images/blog/3.jpg" alt="博客文章" /></a>
<div class="meta-details">
<img class="thumb" src="assets/images/blog/b6.jpg" alt="作者头像" />
<span>作者：王磊</span>
</div>
</div>
<div class="content-body">
<h4 class="title">
<a href="javascript:void(0)">
提升用户留存的 5 个关键策略
</a>
</h4>
<p>
用户留存是增长的基石。我们结合案例，总结了提升用户粘性与活跃度的实用方法，值得收藏。
</p>
</div>
</div>
<!-- 单篇新闻结束 -->
</div>
</div>
</div>
</div>
<!-- 最新动态区域 结束 -->
<!-- 品牌展示区域 开始 -->
<div id="clients" class="brand-area section">
<!--====== 标题区域 开始 ======-->
@@ -682,8 +398,8 @@
</div>
<div class="contact-content">
<h4>联系方式</h4>
<p>0984537278623</p>
<p>yourmail@yunzer.cn</p>
<p>{yz:phone}</p>
<p>{yz:email}</p>
</div>
</div>
</div>
@@ -694,8 +410,7 @@
</div>
<div class="contact-content">
<h4>公司地址</h4>
<p>北京市朝阳区建国路88号SOHO现代城</p>
<p>中国 · 北京</p>
<p>{yz:address}</p>
</div>
</div>
</div>
@@ -786,7 +501,7 @@
<!-- 单个小组件 -->
<div class="footer-widget f-about">
<div class="logo">
<a href="index.html">
<a href="/">
<img src="{yz:logo}" alt="云泽网" class="img-fluid" />
</a>
</div>
go/themes/theme1/news.html
+251
View File
@@ -0,0 +1,251 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="description" content="{yz:description}" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<title>{yz:sitename}</title>
<link rel="shortcut icon" href="{yz:ico}" type="image/svg" />
<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="assets/css/lineicons.css" />
<link rel="stylesheet" href="assets/css/tiny-slider.css" />
<link rel="stylesheet" href="assets/css/glightbox.min.css" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<!--====== 导航栏 开始 ======-->
<section class="navbar-area navbar-nine">
<div class="container">
<div class="row">
<div class="col-lg-12">
<nav class="navbar navbar-expand-lg">
<a class="navbar-brand" href="/">
<img src="{yz:logo}" alt="{yz:sitename}" />
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNine"
aria-controls="navbarNine" aria-expanded="false" aria-label="切换导航">
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
</button>
<div class="collapse navbar-collapse sub-menu-bar" id="navbarNine">
<ul class="navbar-nav me-auto">
<li class="nav-item">
<a href="/">主页</a>
</li>
{yz:nav}
<li class="nav-item">
<a href="[field:url/]">[field:name/]</a>
[field:children/]
</li>
{/yz:nav}
</ul>
</div>
<div class="navbar-btn d-none d-lg-inline-block">
<a class="menu-bar" href="#side-menu-left"><i class="lni lni-menu"></i></a>
</div>
</nav>
</div>
</div>
</div>
</section>
<!--====== 导航栏 结束 ======-->
<!--====== 侧边栏 开始 ======-->
<div class="sidebar-left">
<div class="sidebar-close">
<a class="close" href="#close"><i class="lni lni-close"></i></a>
</div>
<div class="sidebar-content">
<div class="sidebar-logo">
<a href="/"><img src="{yz:logo}" alt="{yz:sitename}" /></a>
</div>
<p class="text">{yz:description}</p>
<div class="sidebar-menu">
<h5 class="menu-title">快速链接</h5>
<ul>
{yz:nav}
<li><a href="[field:url/]">[field:name/]</a></li>
{/yz:nav}
</ul>
</div>
<div class="sidebar-social align-items-center justify-content-center">
<h5 class="social-title">关注我们</h5>
<ul>
<li><a href="javascript:void(0)"><i class="lni lni-facebook-filled"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-twitter-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-linkedin-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-youtube"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="overlay-left"></div>
<!--====== 侧边栏 结束 ======-->
<!--====== 新闻中心 开始 ======-->
<section id="news-center" class="news-center-area news-list-page">
<div class="article-detail-breadcrumb-wrap">
<div class="container">
<div class="row">
<div class="col-12">
<nav aria-label="breadcrumb">
<ol class="breadcrumb article-detail-breadcrumb">
<li class="breadcrumb-item"><a href="/">主页</a></li>
<li class="breadcrumb-item active" aria-current="page">新闻中心</li>
</ol>
</nav>
</div>
</div>
</div>
</div>
<div class="section-title-five">
<div class="container">
<div class="row">
<div class="col-12">
<div class="content">
<h6>资讯动态</h6>
<h2 class="fw-bold">新闻中心</h2>
<p>了解最新动态、行业资讯与公司公告。</p>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
{yz:arclist row="10" titlelen="40"}
<div class="col-lg-3 col-md-6 col-12">
<div class="single-news news-center-item">
<div class="image">
<a href="[field:arcurl/]"><img class="thumb" src="[field:image/]" alt="[field:titlefull/]" onerror="this.style.display='none'" /></a>
<div class="meta-details">
<span>[field:pubdate/]</span>
</div>
</div>
<div class="content-body">
<h4 class="title">
<a href="[field:arcurl/]" title="[field:titlefull/]">[field:title/]</a>
</h4>
<p>[field:desc/]</p>
<div class="news-item-meta">
<span><i class="lni lni-user"></i> [field:author/]</span>
<span><i class="lni lni-eye"></i> [field:views/]</span>
</div>
</div>
</div>
</div>
{/yz:arclist}
</div>
<div class="news-list-pager">{yz:pagelist/}</div>
</div>
</section>
<!--====== 新闻中心 结束 ======-->
<!-- 页脚区域 开始 -->
<footer class="footer-area footer-eleven">
<div class="footer-top">
<div class="container">
<div class="inner-content">
<div class="row">
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget f-about">
<div class="logo">
<a href="/">
<img src="{yz:logo}" alt="{yz:sitename}" class="img-fluid" />
</a>
</div>
<p>{yz:description}</p>
<p class="copyright-text">
<span>备案号:{yz:icp}<br>{yz:copyright}&nbsp;&nbsp;<a href="www.yunzer.cn" rel="nofollow"> 云泽网 </a></span>
</p>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>解决方案</h5>
<ul>
<li><a href="javascript:void(0)">市场营销</a></li>
<li><a href="javascript:void(0)">数据分析</a></li>
<li><a href="javascript:void(0)">电子商务</a></li>
<li><a href="javascript:void(0)">商业洞察</a></li>
</ul>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>技术支持</h5>
<ul>
<li><a href="javascript:void(0)">价格方案</a></li>
<li><a href="javascript:void(0)">开发文档</a></li>
<li><a href="javascript:void(0)">使用指南</a></li>
<li><a href="javascript:void(0)">API 状态</a></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget newsletter">
<h5>订阅我们</h5>
<p>订阅我们，获取最新资讯</p>
<form action="#" method="get" target="_blank" class="newsletter-form">
<input name="EMAIL" placeholder="邮箱地址" required="required" type="email" />
<div class="button">
<button class="sub-btn">
<i class="lni lni-envelope"></i>
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
<!-- 页脚区域 结束 -->
<a href="#" class="scroll-top btn-hover">
<i class="lni lni-chevron-up"></i>
</a>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/glightbox.min.js"></script>
<script src="assets/js/main.js"></script>
<script src="assets/js/tiny-slider.js"></script>
<script>
let navbarTogglerNine = document.querySelector(".navbar-nine .navbar-toggler");
navbarTogglerNine.addEventListener("click", function () {
navbarTogglerNine.classList.toggle("active");
});
let sidebarLeft = document.querySelector(".sidebar-left");
let overlayLeft = document.querySelector(".overlay-left");
let sidebarClose = document.querySelector(".sidebar-close .close");
overlayLeft.addEventListener("click", function () {
sidebarLeft.classList.toggle("open");
overlayLeft.classList.toggle("open");
});
sidebarClose.addEventListener("click", function () {
sidebarLeft.classList.remove("open");
overlayLeft.classList.remove("open");
});
let sideMenuLeftNine = document.querySelector(".navbar-nine .menu-bar");
sideMenuLeftNine.addEventListener("click", function () {
sidebarLeft.classList.add("open");
overlayLeft.classList.add("open");
});
</script>
</body>
</html>
go/themes/theme1/news_detail.html
+243
View File
@@ -0,0 +1,243 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="description" content="{yz:description}" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<title>{yz:sitename}</title>
<link rel="shortcut icon" href="{yz:ico}" type="image/svg" />
<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="assets/css/lineicons.css" />
<link rel="stylesheet" href="assets/css/tiny-slider.css" />
<link rel="stylesheet" href="assets/css/glightbox.min.css" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<!--====== 导航栏 开始 ======-->
<section class="navbar-area navbar-nine">
<div class="container">
<div class="row">
<div class="col-lg-12">
<nav class="navbar navbar-expand-lg">
<a class="navbar-brand" href="/">
<img src="{yz:logo}" alt="{yz:sitename}" />
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNine"
aria-controls="navbarNine" aria-expanded="false" aria-label="切换导航">
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
</button>
<div class="collapse navbar-collapse sub-menu-bar" id="navbarNine">
<ul class="navbar-nav me-auto">
<li class="nav-item">
<a href="/">主页</a>
</li>
{yz:nav}
<li class="nav-item">
<a href="[field:url/]">[field:name/]</a>
[field:children/]
</li>
{/yz:nav}
</ul>
</div>
<div class="navbar-btn d-none d-lg-inline-block">
<a class="menu-bar" href="#side-menu-left"><i class="lni lni-menu"></i></a>
</div>
</nav>
</div>
</div>
</div>
</section>
<!--====== 导航栏 结束 ======-->
<!--====== 侧边栏 开始 ======-->
<div class="sidebar-left">
<div class="sidebar-close">
<a class="close" href="#close"><i class="lni lni-close"></i></a>
</div>
<div class="sidebar-content">
<div class="sidebar-logo">
<a href="/"><img src="{yz:logo}" alt="{yz:sitename}" /></a>
</div>
<p class="text">{yz:description}</p>
<div class="sidebar-menu">
<h5 class="menu-title">快速链接</h5>
<ul>
{yz:nav}
<li><a href="[field:url/]">[field:name/]</a></li>
{/yz:nav}
</ul>
</div>
<div class="sidebar-social align-items-center justify-content-center">
<h5 class="social-title">关注我们</h5>
<ul>
<li><a href="javascript:void(0)"><i class="lni lni-facebook-filled"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-twitter-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-linkedin-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-youtube"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="overlay-left"></div>
<!--====== 侧边栏 结束 ======-->
<!--====== 文章详情 开始 ======-->
<section class="article-detail-area">
<div class="article-detail-breadcrumb-wrap">
<div class="container">
<div class="row">
<div class="col-12">
<nav aria-label="breadcrumb">
<ol class="breadcrumb article-detail-breadcrumb">
<li class="breadcrumb-item"><a href="/">主页</a></li>
<li class="breadcrumb-item"><a href="/news">新闻中心</a></li>
{yz:arcview}
<li class="breadcrumb-item active" aria-current="page">[field:title/]</li>
{/yz:arcview}
</ol>
</nav>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10 col-xl-9">
{yz:arcview}
<article class="article-detail-card">
<div class="article-detail-thumb" style="display:none;">
<img src="[field:image/]" alt="[field:title/]" class="article-cover" onerror="this.closest('.article-detail-thumb').style.display='none'" onload="this.closest('.article-detail-thumb').style.display='block'" />
</div>
<h1 class="article-detail-title">[field:title/]</h1>
<div class="article-detail-meta">
<span><i class="lni lni-calendar"></i> [field:pubdate/]</span>
<span><i class="lni lni-user"></i> [field:author/]</span>
<span><i class="lni lni-eye"></i> [field:views/] 阅读</span>
</div>
<div class="article-detail-content">
[field:content/]
</div>
</article>
{/yz:arcview}
<div class="article-detail-back">
<a href="/news" class="btn primary-btn-outline">
<i class="lni lni-arrow-left"></i> 返回新闻中心
</a>
</div>
</div>
</div>
</div>
</section>
<!--====== 文章详情 结束 ======-->
<!-- 页脚区域 开始 -->
<footer class="footer-area footer-eleven">
<div class="footer-top">
<div class="container">
<div class="inner-content">
<div class="row">
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget f-about">
<div class="logo">
<a href="/">
<img src="{yz:logo}" alt="{yz:sitename}" class="img-fluid" />
</a>
</div>
<p>{yz:description}</p>
<p class="copyright-text">
<span>备案号:{yz:icp}<br>{yz:copyright}&nbsp;&nbsp;<a href="www.yunzer.cn" rel="nofollow"> 云泽网 </a></span>
</p>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>解决方案</h5>
<ul>
<li><a href="javascript:void(0)">市场营销</a></li>
<li><a href="javascript:void(0)">数据分析</a></li>
<li><a href="javascript:void(0)">电子商务</a></li>
<li><a href="javascript:void(0)">商业洞察</a></li>
</ul>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>技术支持</h5>
<ul>
<li><a href="javascript:void(0)">价格方案</a></li>
<li><a href="javascript:void(0)">开发文档</a></li>
<li><a href="javascript:void(0)">使用指南</a></li>
<li><a href="javascript:void(0)">API 状态</a></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget newsletter">
<h5>订阅我们</h5>
<p>订阅我们，获取最新资讯</p>
<form action="#" method="get" target="_blank" class="newsletter-form">
<input name="EMAIL" placeholder="邮箱地址" required="required" type="email" />
<div class="button">
<button class="sub-btn">
<i class="lni lni-envelope"></i>
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
<!-- 页脚区域 结束 -->
<a href="#" class="scroll-top btn-hover">
<i class="lni lni-chevron-up"></i>
</a>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/glightbox.min.js"></script>
<script src="assets/js/main.js"></script>
<script src="assets/js/tiny-slider.js"></script>
<script>
let navbarTogglerNine = document.querySelector(".navbar-nine .navbar-toggler");
navbarTogglerNine.addEventListener("click", function () {
navbarTogglerNine.classList.toggle("active");
});
let sidebarLeft = document.querySelector(".sidebar-left");
let overlayLeft = document.querySelector(".overlay-left");
let sidebarClose = document.querySelector(".sidebar-close .close");
overlayLeft.addEventListener("click", function () {
sidebarLeft.classList.toggle("open");
overlayLeft.classList.toggle("open");
});
sidebarClose.addEventListener("click", function () {
sidebarLeft.classList.remove("open");
overlayLeft.classList.remove("open");
});
let sideMenuLeftNine = document.querySelector(".navbar-nine .menu-bar");
sideMenuLeftNine.addEventListener("click", function () {
sidebarLeft.classList.add("open");
overlayLeft.classList.add("open");
});
</script>
</body>
</html>
go/themes/theme1/page.html
+189
View File
@@ -0,0 +1,189 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="description" content="{yz:description}" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<title>{yz:sitename}</title>
<link rel="shortcut icon" href="{yz:ico}" type="image/svg" />
<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="assets/css/lineicons.css" />
<link rel="stylesheet" href="assets/css/tiny-slider.css" />
<link rel="stylesheet" href="assets/css/glightbox.min.css" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<section class="navbar-area navbar-nine">
<div class="container">
<div class="row">
<div class="col-lg-12">
<nav class="navbar navbar-expand-lg">
<a class="navbar-brand" href="/">
<img src="{yz:logo}" alt="{yz:sitename}" />
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNine"
aria-controls="navbarNine" aria-expanded="false" aria-label="切换导航">
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
<span class="toggler-icon"></span>
</button>
<div class="collapse navbar-collapse sub-menu-bar" id="navbarNine">
<ul class="navbar-nav me-auto">
<li class="nav-item"><a href="/">主页</a></li>
{yz:nav}
<li class="nav-item">
<a href="[field:url/]">[field:name/]</a>
[field:children/]
</li>
{/yz:nav}
</ul>
</div>
<div class="navbar-btn d-none d-lg-inline-block">
<a class="menu-bar" href="#side-menu-left"><i class="lni lni-menu"></i></a>
</div>
</nav>
</div>
</div>
</div>
</section>
<div class="sidebar-left">
<div class="sidebar-close"><a class="close" href="#close"><i class="lni lni-close"></i></a></div>
<div class="sidebar-content">
<div class="sidebar-logo"><a href="/"><img src="{yz:logo}" alt="{yz:sitename}" /></a></div>
<p class="text">{yz:description}</p>
<div class="sidebar-menu">
<h5 class="menu-title">快速链接</h5>
<ul>
{yz:nav}
<li><a href="[field:url/]">[field:name/]</a></li>
{/yz:nav}
</ul>
</div>
<div class="sidebar-social align-items-center justify-content-center">
<h5 class="social-title">关注我们</h5>
<ul>
<li><a href="javascript:void(0)"><i class="lni lni-facebook-filled"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-twitter-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-linkedin-original"></i></a></li>
<li><a href="javascript:void(0)"><i class="lni lni-youtube"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="overlay-left"></div>
<section class="article-detail-area page-inner-page">
<div class="article-detail-breadcrumb-wrap">
<div class="container">
<div class="row">
<div class="col-12">
<nav aria-label="breadcrumb">
<ol class="breadcrumb article-detail-breadcrumb">
<li class="breadcrumb-item"><a href="/">主页</a></li>
<li class="breadcrumb-item active" aria-current="page">{yz:onepage field="title"/}</li>
</ol>
</nav>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10 col-xl-9">
<article class="article-detail-card">
<h1 class="article-detail-title">{yz:onepage field="title"/}</h1>
<div class="onepage-content">
{yz:onepage/}
</div>
</article>
</div>
</div>
</div>
</section>
<footer class="footer-area footer-eleven">
<div class="footer-top">
<div class="container">
<div class="inner-content">
<div class="row">
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget f-about">
<div class="logo"><a href="/"><img src="{yz:logo}" alt="{yz:sitename}" class="img-fluid" /></a></div>
<p>{yz:description}</p>
<p class="copyright-text">
<span>备案号:{yz:icp}<br>{yz:copyright}&nbsp;&nbsp;<a href="www.yunzer.cn" rel="nofollow"> 云泽网 </a></span>
</p>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>解决方案</h5>
<ul>
<li><a href="javascript:void(0)">市场营销</a></li>
<li><a href="javascript:void(0)">数据分析</a></li>
<li><a href="javascript:void(0)">电子商务</a></li>
<li><a href="javascript:void(0)">商业洞察</a></li>
</ul>
</div>
</div>
<div class="col-lg-2 col-md-6 col-12">
<div class="footer-widget f-link">
<h5>技术支持</h5>
<ul>
<li><a href="javascript:void(0)">价格方案</a></li>
<li><a href="javascript:void(0)">开发文档</a></li>
<li><a href="javascript:void(0)">使用指南</a></li>
<li><a href="javascript:void(0)">API 状态</a></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-6 col-12">
<div class="footer-widget newsletter">
<h5>订阅我们</h5>
<p>订阅我们，获取最新资讯</p>
<form action="#" method="get" target="_blank" class="newsletter-form">
<input name="EMAIL" placeholder="邮箱地址" required="required" type="email" />
<div class="button"><button class="sub-btn"><i class="lni lni-envelope"></i></button></div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
<a href="#" class="scroll-top btn-hover"><i class="lni lni-chevron-up"></i></a>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/glightbox.min.js"></script>
<script src="assets/js/main.js"></script>
<script src="assets/js/tiny-slider.js"></script>
<script>
document.querySelector(".navbar-nine .navbar-toggler").addEventListener("click", function () {
this.classList.toggle("active");
});
var sidebarLeft = document.querySelector(".sidebar-left");
var overlayLeft = document.querySelector(".overlay-left");
overlayLeft.addEventListener("click", function () {
sidebarLeft.classList.toggle("open");
overlayLeft.classList.toggle("open");
});
document.querySelector(".sidebar-close .close").addEventListener("click", function () {
sidebarLeft.classList.remove("open");
overlayLeft.classList.remove("open");
});
document.querySelector(".navbar-nine .menu-bar").addEventListener("click", function () {
sidebarLeft.classList.add("open");
overlayLeft.classList.add("open");
});
</script>
</body>
</html>
go/themes/theme1/style.css
+558
View File
@@ -1478,6 +1478,167 @@ p {
/*===== news-center-area =====*/
.news-center-area {
background-color: var(--light-3);
padding-top: 100px;
padding-bottom: 80px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.news-center-area {
padding-top: 80px;
padding-bottom: 60px;
}
}
@media (max-width: 767px) {
.news-center-area {
padding-top: 60px;
padding-bottom: 40px;
}
}
.news-center-area .news-center-tabs {
margin-bottom: 10px;
}
.news-center-area .news-center-tabs .nav-tabs {
border: none;
justify-content: center;
gap: 10px;
flex-wrap: wrap;
}
.news-center-area .news-center-tabs .nav-link {
border: none;
color: var(--dark-1);
font-weight: 600;
background-color: var(--white);
padding: 10px 22px;
border-radius: 4px;
}
.news-center-area .news-center-tabs .nav-link:hover {
color: var(--primary);
}
.news-center-area .news-center-tabs .nav-link.active {
background-color: var(--primary);
color: var(--white);
}
.news-center-area .news-center-item {
margin-top: 30px;
background: var(--white);
border-radius: 6px;
overflow: hidden;
height: calc(100% - 30px);
}
.news-center-area .news-center-item .image {
position: relative;
overflow: hidden;
min-height: 160px;
background: var(--light-2);
}
.news-center-area .news-center-item .image img {
width: 100%;
height: 180px;
object-fit: cover;
transition: all 0.4s ease;
}
.news-center-area .news-center-item .image .meta-details {
position: absolute;
right: 12px;
bottom: 12px;
background-color: var(--primary);
color: var(--white);
padding: 4px 12px;
border-radius: 20px;
font-size: 12px;
}
.news-center-area .news-center-item .content-body {
padding: 18px 16px 20px;
}
.news-center-area .news-center-item .content-body .title {
margin: 0 0 10px 0;
font-size: 16px;
}
.news-center-area .news-center-item .content-body .title a {
color: var(--black);
}
.news-center-area .news-center-item .content-body .title a:hover {
color: var(--primary);
}
.news-center-area .news-center-item .content-body p {
color: var(--dark-3);
font-size: 14px;
margin: 0;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.news-center-area .news-center-item:hover .image .thumb {
transform: scale(1.08);
}
.news-center-area .news-center-more {
text-align: center;
margin-top: 40px;
}
/*===== news-list-page =====*/
.news-list-page {
padding-top: 0;
}
.news-list-page .section-title-five {
margin-bottom: 30px;
}
.news-list-page .news-item-meta {
display: flex;
flex-wrap: wrap;
gap: 12px 16px;
margin-top: 12px;
color: var(--gray-1);
font-size: 12px;
}
.news-list-page .news-item-meta span {
display: inline-flex;
align-items: center;
gap: 4px;
}
.news-list-page .news-item-meta i {
color: var(--primary);
font-size: 14px;
}
.news-list-pager {
margin-top: 40px;
margin-bottom: 10px;
text-align: center;
}
.news-list-pager .yz-pagination {
display: inline-flex;
flex-wrap: wrap;
justify-content: center;
gap: 8px;
}
.news-list-pager .yz-page {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 38px;
padding: 0 12px;
border: 1px solid var(--gray-4);
border-radius: 6px;
font-size: 14px;
font-weight: 500;
color: var(--dark-2);
background: var(--white);
transition: all 0.2s ease;
}
.news-list-pager .yz-page:hover {
color: var(--primary);
border-color: var(--primary);
}
.news-list-pager .yz-page.current {
background: var(--primary);
border-color: var(--primary);
color: var(--white);
}
/*===== latest-news-area =====*/
.latest-news-area {
background: var(--white);
@@ -1905,3 +2066,400 @@ p {
color: var(--white);
background-color: var(--primary-dark);
}
/*===== article-detail-area =====*/
.article-detail-area {
padding-bottom: 80px;
background-color: var(--light-3);
}
.article-detail-breadcrumb-wrap {
padding-top: 120px;
padding-bottom: 24px;
}
@media (max-width: 991px) {
.article-detail-breadcrumb-wrap {
padding-top: 100px;
padding-bottom: 16px;
}
}
.article-detail-breadcrumb {
justify-content: flex-start;
margin-bottom: 0;
padding: 0;
background: transparent;
font-size: 14px;
}
.article-detail-breadcrumb .breadcrumb-item a {
color: var(--dark-3);
transition: color 0.2s ease;
}
.article-detail-breadcrumb .breadcrumb-item a:hover {
color: var(--primary);
}
.article-detail-breadcrumb .breadcrumb-item.active {
color: var(--black);
font-weight: 500;
max-width: 420px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.article-detail-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
color: var(--gray-2);
}
.article-detail-card {
background: var(--white);
border-radius: 12px;
box-shadow: var(--shadow-2);
padding: 40px;
margin-bottom: 24px;
}
@media (max-width: 767px) {
.article-detail-card {
padding: 24px 20px;
}
}
.article-detail-thumb {
margin-bottom: 28px;
border-radius: 10px;
overflow: hidden;
}
.article-detail-thumb .article-cover {
width: 100%;
max-height: 420px;
object-fit: cover;
display: block;
}
.article-detail-title {
font-size: 32px;
font-weight: 700;
line-height: 1.35;
color: var(--black);
margin-bottom: 20px;
}
@media (max-width: 767px) {
.article-detail-title {
font-size: 24px;
}
}
.article-detail-meta {
display: flex;
flex-wrap: wrap;
gap: 16px 24px;
padding-bottom: 24px;
margin-bottom: 28px;
border-bottom: 1px solid var(--gray-4);
color: var(--dark-3);
font-size: 14px;
}
.article-detail-meta span {
display: inline-flex;
align-items: center;
gap: 6px;
}
.article-detail-meta i {
color: var(--primary);
font-size: 16px;
}
.article-detail-content {
color: var(--dark-2);
font-size: 16px;
line-height: 1.85;
word-break: break-word;
}
.article-detail-content p {
margin-bottom: 16px;
}
.article-detail-content img {
max-width: 100%;
height: auto;
border-radius: 8px;
margin: 12px 0 20px;
}
.article-detail-content h2,
.article-detail-content h3,
.article-detail-content h4 {
color: var(--black);
font-weight: 700;
margin: 28px 0 14px;
}
.article-detail-content h2 {
font-size: 24px;
}
.article-detail-content h3 {
font-size: 20px;
}
.article-detail-content h4 {
font-size: 18px;
}
.article-detail-content ul,
.article-detail-content ol {
margin: 0 0 16px 20px;
padding: 0;
}
.article-detail-content li {
margin-bottom: 8px;
}
.article-detail-content blockquote {
margin: 20px 0;
padding: 16px 20px;
border-left: 4px solid var(--primary);
background: var(--primary-light);
border-radius: 0 8px 8px 0;
color: var(--dark-2);
}
.article-detail-content a {
color: var(--primary);
}
.article-detail-content a:hover {
color: var(--primary-dark);
}
.article-detail-content table {
width: 100%;
border-collapse: collapse;
margin-bottom: 20px;
}
.article-detail-content table th,
.article-detail-content table td {
border: 1px solid var(--gray-4);
padding: 10px 12px;
}
.article-detail-back {
text-align: center;
margin-bottom: 20px;
}
.article-detail-back .btn i {
margin-right: 6px;
vertical-align: middle;
}
/*===== 首页产品与解决方案展示 =====*/
.product-showcase-grid {
row-gap: 24px;
}
.product-showcase-card {
position: relative;
height: 100%;
min-height: 320px;
padding: 36px 32px 30px;
overflow: hidden;
border: 1px solid var(--gray-4);
border-radius: 16px;
background: var(--white);
box-shadow: var(--shadow-2);
transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.product-showcase-card::after {
position: absolute;
right: -46px;
bottom: -58px;
width: 180px;
height: 180px;
border-radius: 50%;
background: var(--primary-light);
content: "";
transition: transform 0.3s ease;
}
.product-showcase-card:hover {
transform: translateY(-8px);
border-color: var(--primary);
box-shadow: var(--shadow-5);
}
.product-showcase-card:hover::after {
transform: scale(1.25);
}
.product-showcase-card--primary {
border-color: var(--primary);
background: var(--gradient-1);
}
.product-showcase-card--primary::after {
background: rgba(255, 255, 255, 0.12);
}
.product-showcase-icon,
.product-showcase-tag,
.product-showcase-card h3,
.product-showcase-card p,
.product-showcase-link {
position: relative;
z-index: 1;
}
.product-showcase-icon {
display: flex;
width: 52px;
height: 52px;
align-items: center;
justify-content: center;
margin-bottom: 26px;
border-radius: 14px;
background: var(--primary-light);
color: var(--primary);
font-size: 24px;
}
.product-showcase-tag {
display: inline-block;
margin-bottom: 12px;
color: var(--primary);
font-size: 13px;
font-weight: 700;
letter-spacing: 0.08em;
}
.product-showcase-card h3 {
margin-bottom: 14px;
font-size: 24px;
font-weight: 700;
}
.product-showcase-card p {
margin-bottom: 25px;
color: var(--dark-3);
line-height: 1.75;
}
.product-showcase-link,
.solution-showcase-link {
color: var(--primary);
font-weight: 700;
}
.product-showcase-link i,
.solution-showcase-link i {
margin-left: 6px;
font-size: 12px;
transition: transform 0.2s ease;
}
.product-showcase-link:hover i,
.solution-showcase-link:hover i {
transform: translateX(4px);
}
.product-showcase-card--primary .product-showcase-icon {
background: rgba(255, 255, 255, 0.16);
color: var(--white);
}
.product-showcase-card--primary .product-showcase-tag,
.product-showcase-card--primary .product-showcase-link,
.product-showcase-card--primary h3,
.product-showcase-card--primary p {
color: var(--white);
}
.solution-area {
padding: 100px 0;
background: var(--light-3);
}
.solution-showcase-card {
position: relative;
height: 100%;
padding: 38px 34px 32px;
border: 1px solid var(--gray-4);
border-radius: 16px;
background: var(--white);
box-shadow: var(--shadow-2);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.solution-showcase-card:hover {
transform: translateY(-8px);
box-shadow: var(--shadow-5);
}
.solution-showcase-card--featured {
border-color: var(--primary);
}
.solution-showcase-index {
position: absolute;
top: 25px;
right: 28px;
color: var(--gray-3);
font-size: 42px;
font-weight: 800;
line-height: 1;
}
.solution-showcase-icon {
display: flex;
width: 50px;
height: 50px;
align-items: center;
justify-content: center;
margin-bottom: 28px;
border-radius: 50%;
background: var(--primary-light);
color: var(--primary);
font-size: 22px;
}
.solution-showcase-card h3 {
margin-bottom: 14px;
font-size: 23px;
font-weight: 700;
}
.solution-showcase-card p {
min-height: 78px;
margin-bottom: 20px;
color: var(--dark-3);
line-height: 1.75;
}
.solution-showcase-card ul {
margin-bottom: 28px;
}
.solution-showcase-card li {
margin-bottom: 10px;
color: var(--dark-2);
}
.solution-showcase-card li::before {
display: inline-block;
width: 18px;
color: var(--primary);
content: "✓";
font-weight: 700;
}
@media (max-width: 767px) {
.product-showcase-card,
.solution-showcase-card {
min-height: 0;
padding: 30px 24px;
}
.solution-area {
padding: 70px 0;
}
.solution-showcase-card p {
min-height: 0;
}
}
.page-inner-page.about-five,
.page-inner-page.contact-section {
padding-top: 0;
padding-bottom: 80px;
background-color: var(--light-3);
}
.page-inner-page.contact-section {
background-color: var(--white);
}
.onepage-content {
color: var(--dark-2);
font-size: 16px;
line-height: 1.85;
word-break: break-word;
}
.onepage-content p {
margin-bottom: 16px;
}
.onepage-content img {
max-width: 100%;
height: auto;
border-radius: 8px;
margin: 12px 0 20px;
}
.onepage-content h2,
.onepage-content h3,
.onepage-content h4 {
color: var(--black);
font-weight: 700;
margin: 28px 0 14px;
}
.onepage-content a {
color: var(--primary);
}
.onepage-content a:hover {
color: var(--primary-dark);
}
.about-five-content .onepage-content {
margin-top: 24px;
}
.contact-page-content {
margin-bottom: 24px;
text-align: center;
}