guangyin
/
hbt-moore-stone-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:更改图片关键词

master
guangyin 2026-02-28 10:49:31 +08:00
parent 07e6c6eadb
commit c1e29d2994
6 changed files with 985 additions and 888 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
css/index.css
View File

@ -2,9 +2,10 @@
@import url(pscroll.css); @import url(pscroll.css);
/*首页*/ /*首页*/
.i_product_bg { .i_product_bg {
background-color: #f5f5f5; background-color: #000000;
overflow: hidden; overflow: hidden;
padding-bottom: 2.5%; padding-bottom: 2.5%;
color: #FFFFFF;
} }
.i_title { .i_title {
@ -21,18 +22,19 @@
.i_title h2 { .i_title h2 {
overflow: hidden; overflow: hidden;
font-weight: bold; font-weight: bold;
color: #000000; color: #FFFFFF;
letter-spacing: -3px; letter-spacing: 8px;
text-transform: uppercase; text-transform: uppercase;
font-family: Arial, serif; font-family: "Microsoft YaHei UI Light", serif;
} }
.i_title.white h2 { .i_title.white h2 {
color: #fff; color: #fff;
} }
.i_title p { .i_title p {
background: url(../images/i_bg1.png) center bottom no-repeat; background: url(../images/i_bg1.png) center bottom no-repeat;
color: #000000; color: #FFFFFF;
padding-bottom: 15px; padding-bottom: 15px;
} }
@ -242,8 +244,9 @@
} }
.i_case_bg { .i_case_bg {
background: url(../images/i_bg2.jpg) center center no-repeat; /*background: url(../images/i_bg2.jpg) center center no-repeat;*/
background-size: cover; /*background-size: cover;*/
background: #000000;
overflow: hidden; overflow: hidden;
padding-bottom: 4%; padding-bottom: 4%;
} }
@ -391,7 +394,7 @@
/*新闻*/ /*新闻*/
.news_bg { .news_bg {
background: #f2f2f2; background: #000000;
padding-bottom: 50px; padding-bottom: 50px;
overflow: auto; overflow: auto;
} }
@ -454,7 +457,7 @@
.floor_5_1 .floor_5_z h3 { .floor_5_1 .floor_5_z h3 {
font-size: 18px; font-size: 18px;
color: #333; color: #D2D2D2;
line-height: 18px; line-height: 18px;
width: 100%; width: 100%;
display: block; display: block;
@ -463,7 +466,7 @@
.floor_5_1 .floor_5_z p { .floor_5_1 .floor_5_z p {
font-size: 14px; font-size: 14px;
color: #666; color: #D2D2D2;
line-height: 24px; line-height: 24px;
width: 100%; width: 100%;
margin-top: 10px; margin-top: 10px;
@ -473,14 +476,14 @@
.floor_5_1 .floor_5_z i { .floor_5_1 .floor_5_z i {
display: block; display: block;
font-size: 16px; font-size: 16px;
color: #1f6eb1; color: #D2D2D2;
margin: 0; margin: 0;
padding: 0; padding: 0;
width: 170px; width: 170px;
height: 36px; height: 36px;
line-height: 36px; line-height: 36px;
text-align: center; text-align: center;
border: #1f6eb1 solid 2px; background: #E3611C;
border-radius: 18px; border-radius: 18px;
transition: ease-in-out 0.2s; transition: ease-in-out 0.2s;
} }
@ -489,10 +492,10 @@
display: block; display: block;
width: 100px; width: 100px;
height: 100px; height: 100px;
background-color: #1f6eb1; background-color: transparent;
text-align: center; text-align: center;
font-size: 16px; font-size: 16px;
color: #fff; color: #E3611C;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
@ -501,24 +504,25 @@
.floor_5_1 .floor_5_z em span { .floor_5_1 .floor_5_z em span {
display: block; display: block;
font-size: 60px; font-size: 60px;
color: #fff; color: #E3611C;
line-height: 50px; line-height: 50px;
padding-top: 14px; padding-top: 14px;
} }
.floor_5_1 .floor_5_z:hover h3 { .floor_5_1 .floor_5_z:hover h3 {
color: #1f6eb1; color: #E3611C;
} }
.floor_5_1 .floor_5_z:hover p, .floor_5_1 .floor_5_z:hover p,
.floor_5_1 .floor_5_z:hover i span { .floor_5_1 .floor_5_z:hover i span {
color: #333; color: #D2D2D2;
} }
.floor_5_1 .floor_5_z i:hover { .floor_5_1 .floor_5_z i:hover {
background-color: #1f6eb1; cursor: pointer;
color: #fff; /*background-color: #1f6eb1;*/
border: #1f6eb1 solid 2px; /*color: #fff;*/
/*border: #1f6eb1 solid 2px;*/
} }
.floor_5_1 .floor_5_z a:hover b img { .floor_5_1 .floor_5_z a:hover b img {
@ -552,10 +556,9 @@
.floor_5_1 .floor_5_y ul li em { .floor_5_1 .floor_5_y ul li em {
width: 9rem; width: 9rem;
height: 9rem; height: 9rem;
border: #e5e5e5 solid 1px;
text-align: center; text-align: center;
font-size: 1.6rem; font-size: 1.6rem;
color: #333; color: #E5E4E4;
-webkit-transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s;
@ -565,7 +568,7 @@
.floor_5_1 .floor_5_y ul li em span { .floor_5_1 .floor_5_y ul li em span {
display: block; display: block;
font-size: 6rem; font-size: 6rem;
color: #333; color: #E5E4E4;
line-height: 5rem; line-height: 5rem;
padding-top: 1.4rem; padding-top: 1.4rem;
-webkit-transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s;
@ -588,7 +591,7 @@
.floor_5_1 .floor_5_y ul li p { .floor_5_1 .floor_5_y ul li p {
font-size: 1.8rem; font-size: 1.8rem;
color: #333; color: #D2D2D2;
width: 100%; width: 100%;
line-height: 1.8rem; line-height: 1.8rem;
-webkit-transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s;
@ -599,20 +602,21 @@
.floor_5_1 .floor_5_y ul li p span { .floor_5_1 .floor_5_y ul li p span {
display: block; display: block;
font-size: 1.4rem; font-size: 1.4rem;
color: #666; color: #C6C1C1;
line-height: 2.2rem; line-height: 2.2rem;
padding-top: 1.8rem; padding-top: 1.8rem;
font-weight: normal; font-weight: normal;
} }
.floor_5_1 .floor_5_y ul li:hover p { .floor_5_1 .floor_5_y ul li:hover p {
color: #1f6eb1; color: #E3611C;
} }
.floor_5_1 .floor_5_y ul li:hover em, .floor_5_1 .floor_5_y ul li:hover em,
.floor_5_1 .floor_5_y ul li:hover em span { .floor_5_1 .floor_5_y ul li:hover em span {
color: #1f6eb1; color: #E3611C;
} }
/*新闻*/ /*新闻*/
@media screen and (max-width: 1760px) { @media screen and (max-width: 1760px) {
@ -636,19 +640,23 @@
.i_link ul li:nth-child(5n + 0) { .i_link ul li:nth-child(5n + 0) {
margin-right: 0; margin-right: 0;
} }
.floor_5_1 { .floor_5_1 {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
.floor_5_1 .floor_5_z { .floor_5_1 .floor_5_z {
width: 100%; width: 100%;
} }
.floor_5_1 .floor_5_z b { .floor_5_1 .floor_5_z b {
width: 100%; width: 100%;
height: auto; height: auto;
} }
.floor_5_1 .floor_5_y { .floor_5_1 .floor_5_y {
width: 100%; width: 100%;
} }
@ -717,6 +725,7 @@
.nproduct_list2 ul li p { .nproduct_list2 ul li p {
font-size: 12px; font-size: 12px;
} }
.floor_5_1 .floor_5_y ul li h3 { .floor_5_1 .floor_5_y ul li h3 {
width: 100%; width: 100%;
float: right; float: right;
@ -752,7 +761,7 @@
line-height: 24px; line-height: 24px;
text-align: center; text-align: center;
font-size: 16px; font-size: 16px;
color: #999; color: #E5E4E4;
} }
.cloud-product-explain.white { .cloud-product-explain.white {
@ -1323,33 +1332,64 @@
/*核心技术 start*/ /*核心技术 start*/
.core_technology { .core_technology {
display: flex; background: #000000;
color: #FFFFFF;
padding: 52px 0;
} }
.core_technology .wrap {
display: flex;
justify-content: space-around;
}
.core_technology .img_style { .core_technology .img_style {
width: 72px;
height: 72px;
margin-right: 16px; margin-right: 16px;
} }
.core_technology h2{
font-size: 36px;
}
.core_technology p { .core_technology p {
font-size: 16px;
margin-top: 16px; margin-top: 16px;
} }
/*核心技术 end*/ /*核心技术 end*/
.service-item { .service-item {
width: 1px; width: 1px;
flex: 1; flex: 1;
margin: 0 32px; margin: 0 32px;
} }
.service-item img{
width: 100%;
}
.service-item p{
text-align: center;
padding: 8px;
font-size: 28px;
}
.core-bg { .core-bg {
background: url(../images/coreBg.png) no-repeat; background: url(../images/coreBg.png) no-repeat;
background-size: contain; background-size: contain;
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
} }
.core-bg .core-content { .core-bg .core-content {
width: 50%; width: 46%;
} }
.core-bg .core-item { .core-bg .core-item {
display: flex; display: flex;
margin-bottom: 40px;
}
.core-bg .core-item img{
width: 54px;
height: 54px;
margin-right: 24px;
}
.core-bg .core-item h3{
padding: 6px 0;
margin-bottom: 22px;
font-weight: normal;
letter-spacing: 6px;
} }

52
css/style.css
View File

@ -42,7 +42,15 @@ th {
.wrap { .wrap {
clear: both; clear: both;
width: 96%; width: 96%;
max-width: 1300px; max-width: 1800px;
margin: 0 auto;
text-align: left;
zoom: 1;
overflow: hidden;
}
.wrap0 {
clear: both;
width: 100%;
margin: 0 auto; margin: 0 auto;
text-align: left; text-align: left;
zoom: 1; zoom: 1;
@ -51,7 +59,7 @@ th {
.wrap2 { .wrap2 {
clear: both; clear: both;
width: 96%; width: 96%;
max-width: 1300px; max-width: 1800px;
margin: 0 auto; margin: 0 auto;
text-align: left; text-align: left;
zoom: 1; zoom: 1;
@ -65,6 +73,9 @@ th {
zoom: 1; zoom: 1;
overflow: hidden; overflow: hidden;
} }
.bg_black{
background: #000;
}
.divhidden { .divhidden {
display: none; display: none;
} }
@ -105,7 +116,7 @@ th {
font-size: 30px; font-size: 30px;
} }
.f28 { .f28 {
font-size: 30px; font-size: 28px;
} }
.f24 { .f24 {
font-size: 24px; font-size: 24px;
@ -289,7 +300,8 @@ th {
.header-v1 .languages:after{content: "";display: block;position: absolute;left: 50%;right: 50%;bottom: -1px;height:4px;opacity: 0;background-color: #c71d32;-webkit-transition: all .5s;-o-transition: all .5s;-ms-transition: all .5s;transition: all .5s;} .header-v1 .languages:after{content: "";display: block;position: absolute;left: 50%;right: 50%;bottom: -1px;height:4px;opacity: 0;background-color: #c71d32;-webkit-transition: all .5s;-o-transition: all .5s;-ms-transition: all .5s;transition: all .5s;}
.header-v1 .languages:hover:after{left: 1%;right: 1%;opacity: 1;-webkit-transition: all .5s;-o-transition: all .5s;-ms-transition: all .5s;transition: all .5s;}*/ .header-v1 .languages:hover:after{left: 1%;right: 1%;opacity: 1;-webkit-transition: all .5s;-o-transition: all .5s;-ms-transition: all .5s;transition: all .5s;}*/
.header-v1 .top-main .top-main-content { .header-v1 .top-main .top-main-content {
/* float:right;*/ /* margin-top:31px;*/ float:right;
text-align: center; text-align: center;
} }
.navBar { .navBar {
@ -1133,6 +1145,34 @@ th {
filter: Alpha(Opacity=80); filter: Alpha(Opacity=80);
opacity: 0.8; opacity: 0.8;
} }
.case-title{
display: flex;
color: #FFFFFF;
align-items: center;
}
.case-content{
color: #FFFFFF;
text-align: left;
}
.case-icon{
width: 54px !important;
height: 54px !important;
}
.more-style{
display: flex;
justify-content: flex-end;
}
.more-style img{
width: 32px !important;
height: 32px !important;
margin-right: 24px;
}
#owl-demo3 .item{
background: #1D1D1F;
border-radius: 24px;
padding: 24px;
color: #FFFFFF;
}
@media screen and (max-width: 1600px) { @media screen and (max-width: 1600px) {
.f50 { .f50 {
font-size: 47px; font-size: 47px;
@ -1270,6 +1310,10 @@ th {
.f_bg .f_div2_r a { .f_bg .f_div2_r a {
font-size: 18px; font-size: 18px;
} }
.core_technology .img_style{
width: 50px !important;
height: 50px !important;
}
} }
@media screen and (max-width: 960px) { @media screen and (max-width: 960px) {
.f50 { .f50 {

0
images/缂栫粍 5.png → images/case-arrow.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

0
images/缂栫粍 9.png → images/case-icon.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
images/i_bg1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 932 B

After

Width:  |  Height:  |  Size: 932 B

103
index.htm
View File

@ -27,7 +27,7 @@
<script src="/{ms:global.style/}js/owl.carousel.js"></script> <script src="/{ms:global.style/}js/owl.carousel.js"></script>
<script type="text/javascript" src="/{ms:global.style/}js/basic.js"></script> <script type="text/javascript" src="/{ms:global.style/}js/basic.js"></script>
</head> </head>
<body> <body class="bg_black">
<div class="home-header"><#include "header.htm" /></div> <div class="home-header"><#include "header.htm" /></div>
<!--轮显begin--> <!--轮显begin-->
@ -78,28 +78,31 @@
<!--移动端 flash end--> <!--移动端 flash end-->
<!-- 核心技术 start--> <!-- 核心技术 start-->
<div class="core_technology anim anim-1"> <div class="core_technology anim anim-1">
<div class="wrap">
<div class="flex-box"> <div class="flex-box">
<img src="/template/1/default/images/slzch.png" class="img_style" alt="算力资源资产化" /> <img src="/template/1/default/images/slzch.png" class="img_style" alt="算力资源资产化" />
<div> <div>
<h2>算力资源资产化</h2> <h2 class="f36">算力资源资产化</h2>
<p>将异构GPU算力统一计量，封装为标准化的“算力Token”</p> <p class="f16">将异构GPU算力统一计量，封装为标准化的“算力Token”</p>
</div> </div>
</div> </div>
<div class="flex-box"> <div class="flex-box">
<img src="/template/1/default/images/zndd.png" class="img_style" alt="智能调度与交付" /> <img src="/template/1/default/images/zndd.png" class="img_style" alt="智能调度与交付" />
<div> <div>
<h2>智能调度与交付</h2> <h2 class="f36">智能调度与交付</h2>
<p>动态调度Token，高效完成AI训练/推理任务</p> <p class="f16">动态调度Token，高效完成AI训练/推理任务</p>
</div> </div>
</div> </div>
<div class="flex-box"> <div class="flex-box">
<img src="/template/1/default/images/jzjs.png" class="img_style" alt="价值结算与再投资" /> <img src="/template/1/default/images/jzjs.png" class="img_style" alt="价值结算与再投资" />
<div> <div>
<h2>价值结算与再投资</h2> <h2 class="f36">价值结算与再投资</h2>
<p>按Token消耗付费，资金反哺算力设施扩容</p> <p class="f16">按Token消耗付费，资金反哺算力设施扩容</p>
</div> </div>
</div> </div>
</div> </div>
</div>
<!-- 核心技术 end--> <!-- 核心技术 end-->
<div class="i_product_bg"> <div class="i_product_bg">
<div class="wrap2"> <div class="wrap2">
@ -132,8 +135,9 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 核心技术-->
<div class="i_product_bg"> <div class="i_product_bg">
<div class="wrap2"> <div class="wrap0">
<div class="cloud-product"> <div class="cloud-product">
<div class="i_title mg_0 anim anim-1"> <div class="i_title mg_0 anim anim-1">
<h2 class="f41">我们的核心技术</h2> <h2 class="f41">我们的核心技术</h2>
@ -148,31 +152,31 @@
<div class="core-item"> <div class="core-item">
<img src="/template/1/default/images/core-icon.png" class="img_style" alt="智算中心建设运营" /> <img src="/template/1/default/images/core-icon.png" class="img_style" alt="智算中心建设运营" />
<div> <div>
<h3>AI算力运营底座</h3> <h3 class="f28">AI算力运营底座</h3>
<p>提供基于摩尔线程、清微智能等高性能提供GPU集群的AI算力运营调度平台。</p> <p class="f18">提供基于摩尔线程、清微智能等高性能提供GPU集群的AI算力运营调度平台。</p>
</div> </div>
</div> </div>
<div class="core-item"> <div class="core-item">
<img src="/template/1/default/images/core-icon.png" class="img_style" alt="智算中心建设运营" /> <img src="/template/1/default/images/core-icon.png" class="img_style" alt="智算中心建设运营" />
<div> <div>
<h3>一体化开发平台</h3> <h3 class="f28">一体化开发平台</h3>
<p>与三大运营商、头部集成商战略合作，拥有直达千行百 <p class="f18">与三大运营商、头部集成商战略合作，拥有直达千行百
业的规模销售与交付通道</p> 业的规模销售与交付通道</p>
</div> </div>
</div> </div>
<div class="core-item"> <div class="core-item">
<img src="/template/1/default/images/core-icon.png" class="img_style" alt="智算中心建设运营" /> <img src="/template/1/default/images/core-icon.png" class="img_style" alt="智算中心建设运营" />
<div> <div>
<h3>AI人才培育体系</h3> <h3 class="f28">AI人才培育体系</h3>
<p>汇聚各行业领先的垂直AI应用厂商及国家级实验室，共同打造深 <p class="f18">汇聚各行业领先的垂直AI应用厂商及国家级实验室，共同打造深
</p> </p>
</div> </div>
</div> </div>
<div class="core-item"> <div class="core-item">
<img src="/template/1/default/images/core-icon.png" class="img_style" alt="智算中心建设运营" /> <img src="/template/1/default/images/core-icon.png" class="img_style" alt="智算中心建设运营" />
<div> <div>
<h3>专项创投基金</h3> <h3 class="f28">专项创投基金</h3>
<p>擅长将前沿技术转化为客户价格，并协调多元生态伙伴，驱动项 <p class="f18">擅长将前沿技术转化为客户价格，并协调多元生态伙伴，驱动项
目从规划到运营的全周期成功</p> 目从规划到运营的全周期成功</p>
</div> </div>
</div> </div>
@ -182,9 +186,43 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 核心技术-->
<div class="i_case_bg">
<div class="wrap2">
{ms:channel type='self' typeid="1666653706550321164"}
<div class="i_title anim anim-1">
<h2 class="f41">${field.typetitle}</h2>
<p class="f24">${field.typeshorttitle}</p>
</div>
{/ms:channel}
<div id="owl-demo3" class="owl-carousel">
{ms:arclist typeid="1666653706550321164" size=10}
<div class="item">
<dd class="">
<a href="{ms:global.html/}${field.link}" title="${field.title}" >
<!-- <div class="imgs"><img src="{@ms:file field.litpic/}" alt="${field.title}" /></div>-->
<div class="case-title">
<img src="/template/1/default/images/case-icon.png" class="case-icon" alt="">
<h2 class="f22">${field.title}</h2>
</div>
<div class="case-content">
{@ms:len field.descrip 50 /}
</div>
<div class="more-style">
<img src="/template/1/default/images/case-arrow.png" alt="">
</div>
<!-- <div class="txts">
<h2 class="f22">${field.title}</h2>
<p class="p">{@ms:len field.descrip 20 /}</p>
</div>-->
</a>
</dd>
</div>
{/ms:arclist}
</div>
</div>
</div>
<div class="i_product_bg"> <div class="i_product_bg">
<div class="wrap2"> <div class="wrap2">
{ms:channel type='self' typeid="1666653706550321152"} {ms:channel type='self' typeid="1666653706550321152"}
@ -247,7 +285,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="wrap2"> <div class="wrap2 bg_black">
{ms:channel type='self' typeid="1666653706550321163"} {ms:channel type='self' typeid="1666653706550321163"}
<div class="i_title anim anim-1"> <div class="i_title anim anim-1">
<h2 class="f41">${field.typetitle}</h2> <h2 class="f41">${field.typetitle}</h2>
@ -272,32 +310,7 @@
</ul> </ul>
</div> </div>
</div> </div>
<div class="i_case_bg"> <div class="wrap bg_black">
<div class="wrap2">
{ms:channel type='self' typeid="1666653706550321164"}
<div class="i_title anim anim-1">
<h2 class="f41">${field.typetitle}</h2>
<p class="f24">${field.typeshorttitle}</p>
</div>
{/ms:channel}
<div id="owl-demo3" class="owl-carousel">
{ms:arclist typeid="1666653706550321164" size=10}
<div class="item">
<dd class="">
<a href="{ms:global.html/}${field.link}" title="${field.title}">
<div class="imgs"><img src="{@ms:file field.litpic/}" alt="${field.title}" /></div>
<div class="txts">
<h2 class="f22">${field.title}</h2>
<p class="p">{@ms:len field.descrip 20 /}</p>
</div>
</a>
</dd>
</div>
{/ms:arclist}
</div>
</div>
</div>
<div class="wrap">
{ms:channel type='self' typeid="1666653706550321169"} {ms:channel type='self' typeid="1666653706550321169"}
<div class="i_title anim anim-1"> <div class="i_title anim anim-1">
<h2 class="f41">${field.typetitle}</h2> <h2 class="f41">${field.typetitle}</h2>