yuan.wenxu/copyweb
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:产品中心,荣誉资质,工程业绩,新闻中心大部分完成

Browse Source
This commit is contained in:
Nightwindsss committed 2025-04-02 01:47:41 +08:00
1 parent 6cd4ceb6e2
commit 6220a8f682
16 files changed
+337
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

honor.html
+80
View File
@@ -0,0 +1,80 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.css" type="text/css" rel="stylesheet" />
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" href="./static/css/common.css">
<link rel="stylesheet" href="./static/css/index.css">
</head>
<body>
<!-- 荣誉资质 -->
<div class="relative">
<div class="size-full"><img class="size-full object-cover object-center" src="/copyweb/static/images/honor-img-head.jpg" alt=""></div>
<div class="absolute top-0 left-0 size-full flex flex-row justify-center items-center">
<div class="flex flex-col justify-center items-center">
<div class="text-[2rem] text-white font-bold tracking-widest">荣誉资质</div>
<div class="flex flex-row text-white mt-[.625rem]">
<img class="w-[1.25rem] h-[1.25rem] object-cover object-center" src="/copyweb/static/images/introduction-img-2.png" alt="">
<div class="ml-[.625rem]">您现在的位置： </div>
<a href="" class="hover:text-[#ff2a2a]">首页</a>
-
<a href="" class="hover:text-[#ff2a2a]">荣誉资质</a>
</div>
</div>
</div>
</div>
<!-- 荣誉资质 -->
<!-- 荣誉内容 -->
<div class="py-[4.0625rem] px-[4%]">
<div class="grid grid-rows-3 gap-[1.25rem] max-[1200px]:grid-rows-6 max-[1050px]:grid-rows-9 max-[600px]:grid-rows-18">
<div class="grid grid-cols-6 gap-[1.25rem] row-span-1 max-[1200px]:grid-cols-3 max-[1050px]:grid-cols-2 max-[600px]:grid-cols-1">
<a href="#">
<div class="relative">
<div class="size-full group">
<div class="size-full overflow-hidden cursor-pointer">
<img class="size-full object-cover object-center transition-transform duration-500 group-hover:scale-105" src="/copyweb/static/images/honor-img-1.jpg" alt="">
</div>
<div class="absolute top-0 left-0 size-full bg-black bg-opacity-0 z-10 group-hover:bg-opacity-50 transition duration-300 ease-in-out"></div>
<div class="absolute top-0 left-0 size-full opacity-0 translate-x-[50%] z-10 group-hover:opacity-100 group-hover:translate-x-0 transition duration-500 ease-in-out flex flex-row items-center justify-center">
<div class="border-[.0625rem] border-white text-white px-[.875rem] py-[.4375rem] shadow">
查看详情
</div>
</div>
</div>
</div>
</a>
<a href="#">
<div class="relative">
<div class="size-full group">
<div class="size-full overflow-hidden cursor-pointer">
<img class="size-full object-cover object-center transition-transform duration-500 group-hover:scale-105" src="/copyweb/static/images/honor-img-1.jpg" alt="">
</div>
<div class="absolute top-0 left-0 size-full bg-black bg-opacity-0 z-10 group-hover:bg-opacity-50 transition duration-300 ease-in-out"></div>
<div class="absolute top-0 left-0 size-full opacity-0 translate-x-[50%] z-10 group-hover:opacity-100 group-hover:translate-x-0 transition duration-500 ease-in-out flex flex-row items-center justify-center">
<div class="border-[.0625rem] border-white text-white px-[.875rem] py-[.4375rem] shadow">
查看详情
</div>
</div>
</div>
</div>
</a>
</div>
</div>
</div>
<!-- 荣誉内容 -->
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.6.0/jquery.min.js"
type="application/javascript"></script>
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.js"
type="application/javascript"></script>
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.js"
type="application/javascript"></script>
<script src="./static/js/common.js"></script>
<script src="./static/js/index.js"></script>
</body>
</html>
news.html
+58
View File
@@ -0,0 +1,58 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.css" type="text/css" rel="stylesheet" />
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" href="./static/css/common.css">
<link rel="stylesheet" href="./static/css/index.css">
</head>
<body>
<!--新闻中心-->
<div class="relative">
<div class="size-full"><img class="size-full object-cover object-center" src="/copyweb/static/images/project-img-head.jpg" alt=""></div>
<div class="absolute top-0 left-0 size-full flex flex-row justify-center items-center">
<div class="flex flex-col justify-center items-center">
<div class="text-[2rem] text-white font-bold tracking-widest">新闻中心</div>
<div class="flex flex-row text-white mt-[.625rem]">
<img class="w-[1.25rem] h-[1.25rem] object-cover object-center" src="/copyweb/static/images/introduction-img-2.png" alt="">
<div class="ml-[.625rem]">您现在的位置： </div>
<a href="" class="hover:text-[#ff2a2a]">首页</a>
-
<a href="" class="hover:text-[#ff2a2a]">新闻中心</a>
</div>
</div>
</div>
</div>
<!-- 新闻中心 -->
<!-- 新闻内容 -->
<div class="py-[7.8125rem] px-[4%]">
<div class="w-full pt-[2.1875rem] mb-[2.1875rem] border-t-[.0625rem] border-solid border-[#eee] flex flex-row">
<div class="w-[6.25rem] flex flex-col items-center">
<div class="text-[#999] text-[1.5rem] mt-[.625rem]">
09-28
</div>
<div class="mt-[1.5625rem] py-[.3125rem] px-[.9375rem]">
<img src="/copyweb/static/images/right-arrow.png" alt="工业自动化生产线的发展背景">
</div>
</div>
<div>123</div>
<div>123</div>
<div class="w-[16rem] h-full">
<img class="object-cover object-center" src="/copyweb/static/images/news-img-1.jpg" alt="">
</div>
</div>
</div>
<!-- 新闻内容 -->
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.6.0/jquery.min.js" type="application/javascript"></script>
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.js" type="application/javascript"></script>
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.js" type="application/javascript"></script>
<script src="./static/js/common.js"></script>
<script src="./static/js/index.js"></script>
</body>
</html>
product-detail.html
+76
View File
@@ -0,0 +1,76 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.css" type="text/css"
rel="stylesheet" />
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.css" type="text/css"
rel="stylesheet" />
<link rel="stylesheet" href="./static/css/common.css">
<link rel="stylesheet" href="./static/css/index.css">
</head>
<body>
<!-- 产品中心 -->
<div class="relative">
<div class="size-full"><img class="size-full object-cover object-center"
src="/copyweb/static/images/product-img-head.jpg" alt=""></div>
<div class="absolute top-0 left-0 size-full flex flex-row justify-center items-center">
<div class="flex flex-col justify-center items-center">
<div class="text-[2rem] text-white font-bold tracking-widest">产品中心</div>
<div class="flex flex-row text-white mt-[.625rem]">
<img class="w-[1.25rem] h-[1.25rem] object-cover object-center"
src="/copyweb/static/images/introduction-img-2.png" alt="">
<div class="ml-[.625rem]">您现在的位置： </div><a href="" class="hover:text-[#ff2a2a]">首页</a>-<a href=""
class="hover:text-[#ff2a2a]">产品中心</a>
</div>
</div>
</div>
</div>
<!-- 产品中心 -->
<!-- 产品内容 -->
<div class="py-[5.3125rem] px-[4%]">
<div class="w-full flex flex-row max-[990px]:flex-col">
<div class="w-[40%] max-[990px]:w-full h-full overflow-hidden cursor-pointer">
<img class="size-full object-cover object-center" src="static/images/product-img-1.jpg" alt="">
</div>
<div class="w-[60%] max-[990px]:w-full py-[4.0625rem] px-[5.3125rem] bg-[url(static/images/product-detail-bg.jpg)]">
<div class="mb-[1.5625rem] pb-[1.5625rem] border-b-[.125rem] border-solid border-[#333]">
<div class="text-[2.25rem] leading-[1.4] text-[#333]">控制柜、控制箱</div>
</div>
<div class="my-[.9375rem] text-[1rem] text-[#555] leading-[1.6] truncate">
代理威图、梅勒等公司产品定做各种非标柜体、箱体
</div>
<div class="flex flex-row pt-[1.875rem] pb-[.625rem] items-center">
<div class="flex flex-row text-[1.125rem]">
<img class="mr-[.5rem]" src="/copyweb/static/images/product-detail-tel.png" alt="">
产品咨询电话：
</div>
<a class="text-[#da191e] text-[1.5rem] font-bold" href="tel:0519 85853200">0519 85853200</a>
</div>
<div class="py-[1.25rem]">
<a href="" class="py-[.9375rem] px-[1.5625rem] bg-[#da191e] text-white inline-flex">
<img class="mr-[.5rem]" src="/copyweb/static/images/product-detail-person.png" alt="">联系我们
</a>
</div>
</div>
</div>
</div>
<!-- 产品内容 -->
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.6.0/jquery.min.js"
type="application/javascript"></script>
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.js"
type="application/javascript"></script>
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.js"
type="application/javascript"></script>
<script src="./static/js/common.js"></script>
<script src="./static/js/index.js"></script>
</body>
</html>
product.html
+73
View File
@@ -0,0 +1,73 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.css" type="text/css"
rel="stylesheet" />
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.css" type="text/css"
rel="stylesheet" />
<link rel="stylesheet" href="./static/css/common.css">
<link rel="stylesheet" href="./static/css/index.css">
</head>
<body>
<!-- 产品中心 -->
<div class="relative">
<div class="size-full"><img class="size-full object-cover object-center"
src="/copyweb/static/images/product-img-head.jpg" alt=""></div>
<div class="absolute top-0 left-0 size-full flex flex-row justify-center items-center">
<div class="flex flex-col justify-center items-center">
<div class="text-[2rem] text-white font-bold tracking-widest">产品中心</div>
<div class="flex flex-row text-white mt-[.625rem]">
<img class="w-[1.25rem] h-[1.25rem] object-cover object-center"
src="/copyweb/static/images/introduction-img-2.png" alt="">
<div class="ml-[.625rem]">您现在的位置： </div><a href="" class="hover:text-[#ff2a2a]">首页</a>-<a href=""
class="hover:text-[#ff2a2a]">产品中心</a>
</div>
</div>
</div>
</div>
<!-- 产品中心 -->
<!-- 产品内容 -->
<div class="py-[4.0625rem] px-[7%]">
<div class="grid grid-rows-3 gap-[1.25rem] max-[1200px]:grid-rows-4 max-[1050px]:grid-rows-6 max-[600px]:grid-rows-12">
<div class="grid grid-cols-4 row-span-1 gap-[1.25rem] max-[1200px]:grid-cols-3 max-[1050px]:grid-cols-2 max-[600px]:grid-cols-1">
<a href="#">
<div class="h-[24vw] max-[1200px]:h-[35vw] max-[1050px]:h-[55vw] max-[700px]:h-[100vw] relative">
<div class="w-full h-[85%] group">
<div class="size-full overflow-hidden cursor-pointer">
<img class="size-full object-cover object-center transition-transform duration-500 group-hover:scale-110" src="static/images/product-img-1.jpg" alt="">
</div>
<div class="absolute top-0 left-0 w-full h-[85%] bg-black bg-opacity-0 z-10 group-hover:bg-opacity-50 transition duration-300 ease-in-out"></div>
<div class="absolute top-0 left-0 w-full h-[85%] opacity-0 translate-x-[50%] z-10 group-hover:opacity-100 group-hover:translate-x-0 transition duration-500 ease-in-out flex flex-row items-center justify-center">
<div class="border-[.0625rem] border-white text-white px-[.875rem] py-[.4375rem] shadow">
查看详情
</div>
</div>
</div>
<div class="flex flex-row items-center justify-center h-[15%] w-full group bg-gray-100">
<div class="text-[1rem] tracking-[.0625rem] group-hover:text-[#ff5454]">闸门自动化系统</div>
</div>
</div>
</a>
</div>
</div>
</div>
<!-- 产品内容 -->
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.6.0/jquery.min.js"
type="application/javascript"></script>
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.js"
type="application/javascript"></script>
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.js"
type="application/javascript"></script>
<script src="./static/js/common.js"></script>
<script src="./static/js/index.js"></script>
</body>
</html>
project.html
+46
View File
@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.css" type="text/css" rel="stylesheet" />
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" href="./static/css/common.css">
<link rel="stylesheet" href="./static/css/index.css">
</head>
<body>
<!--工程业绩-->
<div class="relative">
<div class="size-full"><img class="size-full object-cover object-center" src="/copyweb/static/images/project-img-head.jpg" alt=""></div>
<div class="absolute top-0 left-0 size-full flex flex-row justify-center items-center">
<div class="flex flex-col justify-center items-center">
<div class="text-[2rem] text-white font-bold tracking-widest">工程业绩</div>
<div class="flex flex-row text-white mt-[.625rem]">
<img class="w-[1.25rem] h-[1.25rem] object-cover object-center" src="/copyweb/static/images/introduction-img-2.png" alt="">
<div class="ml-[.625rem]">您现在的位置： </div>
<a href="" class="hover:text-[#ff2a2a]">首页</a>
-
<a href="" class="hover:text-[#ff2a2a]">工程业绩</a>
</div>
</div>
</div>
</div>
<!-- 工程业绩 -->
<!-- 工程内容 -->
<div class="py-[7.8125rem] px-[4%]">
<div class="flex items-center justify-center">
<img src="/copyweb/static/images/project-img-1.jpg" alt="">
</div>
</div>
<!-- 工程内容 -->
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.6.0/jquery.min.js" type="application/javascript"></script>
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/Swiper/7.4.1/swiper-bundle.min.js" type="application/javascript"></script>
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/aos/3.0.0-beta.6/aos.js" type="application/javascript"></script>
<script src="./static/js/common.js"></script>
<script src="./static/js/index.js"></script>
</body>
</html>
static/css/index.css
+4
View File
@@ -6,3 +6,7 @@
.overlay.active {
transform: translateX(0);
}
.shadow:hover {
box-shadow:white 0px 0px .625rem;
}
static/images/honor-img-1.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 159 KiB

static/images/honor-img-head.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 656 KiB

static/images/news-img-1.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 122 KiB

static/images/product-detail-bg.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 280 KiB

static/images/product-detail-person.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 771 B

static/images/product-detail-tel.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 837 B

static/images/product-img-head.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 576 KiB

static/images/project-img-1.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 MiB

static/images/project-img-head.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 566 KiB

static/images/right-arrow.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 226 B