diff --git a/fengxiao/css/aboutUs.css b/fengxiao/css/aboutUs.css new file mode 100644 index 0000000..c6e5b57 --- /dev/null +++ b/fengxiao/css/aboutUs.css @@ -0,0 +1,225 @@ +* ,body{ + margin: 0; + padding: 0; + /* box-sizing: border-box; */ +} + + +.banner{ + width: 100%; + height: 100vh; + + /* background: linear-gradient(to bottom, #3A8DFF 0%, #AEE6FF 60%, #F1F1F1 100%), + url(../imgs/support/bg.png); */ + + background: linear-gradient( + to bottom, + #3478FD 0%, + #BED0F4 80%, + #f1f1f1 100% + ); + + /* background: url(../imgs/support/bg.png) no-repeat bottom; */ + background-size: 100% 80%; + background-repeat: no-repeat; + background-size: cover; + background-position: top, center; + box-sizing: border-box; + background-blend-mode: multiply; + margin-top: 12vh; +} + +.banner-content{ + width: 100%; + height: 100%; + background-image: url(../imgs/about/bg.svg); + background-size: 120vw auto; + background-position: 60% -8vw; + background-repeat: no-repeat; + box-sizing: border-box; + position: relative; +} + +.banner-content-text{ + width: 40%; + height: 60%; + position: absolute; + top: 10vw; + left: 30vw; + +} + +.banner-content-text p:nth-child(1){ + font-size: 5vw; + color: #fff; + font-weight: 400; +} + +.banner-content-text p:nth-child(2){ + font-size: 5vw; + color: #fff; + font-weight: 400; +} + +.banner-content-text p:nth-child(3){ + font-size: 1.6vw; + color: rgba(0, 0, 0, 0.6); + font-weight: 400; + letter-spacing: 0.1vw; + margin-top: 2vh; +} + +.banner-content-text a{ + display: inline-block; + width: 9vw; + height: 2.3vw; + background: #fff; + border-radius: 1vw; + background: #3478FD; + text-decoration: none; + display: flex; + align-items: center; + justify-content: center; + margin-top: 3vh; + margin-left: 13vw; + transition: all 0.3s ease; +} + +.banner-content-text a span{ + font-size: 0.9vw; + color: #fff; + font-weight: 400; +} + +.banner-content-text a img{ + width: 1.2vw; + height: 1.2vw; + margin-left: 1vw; +} + +.banner-content-text a:hover{ + transform: scale(1.05); +} +/* ---------------------------- */ +.aboutUs-content{ + width: 100%; + height: 50vh; + background: linear-gradient( + to bottom, + #f1f1f1 0%, + #f1f1f1 100% + ); + position: relative; +} + +.aboutUs-content-text{ + width: 80%; + height: 100%; + + margin: 0 auto; + background: url(../imgs/about/adout1.png) ,url(../imgs/about/adout2.png); + background-size: 25vw auto,25vw auto; + background-position: 0 0,100% 0; + background-repeat: no-repeat; + text-align: center; + box-sizing: border-box; + padding-top: 18vh; + position: relative; + top: -10vw; + left: 2vw; +} + + + +.aboutUs-content-text .text{ + width: 42%; + height: 80%; + background:#fff; + margin: 0 auto; + box-sizing: border-box; + box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.1); + border-radius: 1.05vw; + padding: 2.5vw; + font-size: 1vw; + text-align: left; + color: rgba(0, 0, 0, 0.7); + line-height: 4.2vh; + display: flex; + align-items: center; + text-align: justify; +} +/* ----------------- */ +.aboutUs-team{ + width: 100%; + height: 100vh; + background: linear-gradient( + to bottom, + #f1f1f1 0%, + #D8E8F4 100% + ); + + +} + +.banner-content-list { + width: 100%; + height: 100vh; + /* background-color: #f1f1f1; */ + position: relative; + background-image: url(../imgs/about/bg2.svg); + background-size: 99% 80%; + background-position: 100% 18vw; + background-repeat: no-repeat; + + + } + + .banner-content-list h2{ + font-size: 3vw; + font-weight: 400; + text-align: center; + text-decoration: underline; + color: rgba(0, 0, 0, 0.8); + text-underline-offset: 0.8vw; + text-decoration-thickness: 1px; + } + + .content-listBOX{ + width: 80%; + height: 70%; + /* background: palegoldenrod; */ + margin-top: 4vh; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; + } + + .content-listBOX-item{ + width: 23vw; + height: 73%; + /* background: palegoldenrod; */ + list-style: none; + border-radius: 1vw; + box-shadow: 8px 5px 10px 5px rgba(0,0,0,0.1); + background: #fff; + padding: 1vw; + box-sizing: border-box; + text-align: center; + } + + .content-listBOX-item img{ + width: 100%; + height: auto; + margin: 0 auto; + } + + .content-listBOX-item h3{ + font-size: 1vw; + /* font-weight: 500; */ + margin-top: 4vh; + color: rgba(0, 0, 0, 0.6); + font-weight: 400; + } + + diff --git a/fengxiao/css/aimodel.css b/fengxiao/css/aimodel.css new file mode 100644 index 0000000..d200f21 --- /dev/null +++ b/fengxiao/css/aimodel.css @@ -0,0 +1,393 @@ +body,*{ + margin: 0; + padding: 0; +} +.banner{ + width: 100%; + height: 160vh; + box-sizing: border-box; + padding-top: 12vh; + background: linear-gradient(to bottom, rgba(241, 241, 241, 1) 12vh,#C0E0F5 90vh, #C0E0F5 100%); + /* background: linear-gradient(to bottom, rgba(245, 245, 245, 1) 0%,#C0E0F5 50%, #C0E0F5 100%); */ + +} + + +.banner-top{ + width: 100%; + height: 70vh; + background-image: url(../imgs/model/bg.png); + background-size: 36vw auto; + background-position: 89% 0vw; + background-repeat: no-repeat; + margin: 0; +} +.banner-top-content{ + box-sizing: border-box; + width: 40%; + height: 60%; + margin-left: 15vw; + color: #1A2B3D; + font-weight: 400; + padding-top: 5vw; +} +.banner-top-content p:nth-child(1){ + font-size: 4.5vw; + margin: 0; + + +} +.banner-top-content p:nth-child(2){ + font-size: 4.5vw; + margin: 0; + +} +.banner-top-content p:nth-child(3){ + font-size: 0.95vw; + margin: 0; + color: rgba(0, 0, 0, 0.7); + width: 78%; + margin-top: 1vh; + +} + + +.banner-bottom { + width: 100%; + height: 70vh; + display: flex; + align-items: center; + justify-content: center; + /* background: #f5f9fc; */ + position: relative; + +} + +.carousel-container { + position: relative; + width: 80%; + /* height: 400px; */ + margin: 0 auto; + overflow: hidden; + display: flex; + align-items: center; +} + +.carousel-track { + display: flex; + transition: transform 0.8s cubic-bezier(0.16, 0.77, 0.58, 0.97); + height: 100%; + align-items: center; +} + +.carousel-item { + width: 28vw; + height: 55vh !important; + + border-radius: 20px; + box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); + margin: 0 20px; + flex-shrink: 0; + display: flex; + flex-direction: column; + align-items: center; + overflow: hidden; + position: relative; + background: #fff; + box-sizing: border-box; + padding: 1vw; +} + +/* 确保中间图片完全清晰的关键修改 */ +.carousel-item img { + width: 100%; + height: 80%; + object-fit: cover; + border-radius: 20px 20px 0 0; + /* 明确设置无滤镜 */ + filter: none !important; +} + +/* 仅对两侧卡片应用模糊效果 */ +.carousel-item.left-side img, +.carousel-item.right-side img { + filter: blur(2px) brightness(0.9); + opacity: 0.8; +} + +/* 中间卡片保持原始状态 */ +.carousel-item.center { + box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15); + /* 确保不继承任何模糊效果 */ + filter: none !important; +} + +.carousel-caption { + width: 100%; + padding: 20px; + text-align: center; + font-size: 18px; + color: #444444; + font-weight: 500; + background: #fff; + margin-top: 5vh; +} + +/* 渐变遮罩 */ +.carousel-fade { + position: absolute; + top: 0; + width: 28vw; + height: 100%; + z-index: 5; + pointer-events: none; +} + +.carousel-fade.left { + width: 50vw; + left: 0; + background: linear-gradient(to right, #C0E0F5 0%, #C0E0F5 10%, rgba(207, 231, 246, 0) 80%); +} + +.carousel-fade.right { + right: 0; + background: linear-gradient(to left, rgba(194, 225, 245, 1) 0%, rgba(245, 249, 252, 0) 80%); +} + +/* 指示点放在盒子外部 */ +.carousel-dots { + position: absolute; + left: 56%; + bottom: -40px; + transform: translateX(-50%); + display: flex; + gap: 12px; + z-index: 8; + /* background: red; */ +} + +.carousel-dots .dot { + width: 1vw; + height: 1vw; + border-radius: 50%; + background:#fff; + cursor: pointer; + transition: all 0.3s ease; +} + +.carousel-dots .dot.active { + background: rgba(255, 255, 255, 0.5); + transform: scale(1.2); +} + +/* --------------场景需求分析--------------------- */ +.website-design-content{ + width: 100%; + height: 370vh; + background-color: #f1f1f1; + background-image: url(../imgs/home/bg1.svg); + background-size: 100% auto; + background-position: 89% 106%; + background-repeat: no-repeat; + padding-top: 25vh; +} +.list-item{ + width: 80%; + height: 50vh; + flex-shrink: 0; + margin: 0 auto; + box-sizing: border-box; + display: flex; + align-items: center; + + /* background: palegoldenrod; */ + +} + +.list-item img{ + width: 35vw; + height:auto; +} +.list-item div{ + width: 40vw; + height:auto; + margin-left: 10vw; +} +.list-item div h3{ + font-size: 1.8vw; + font-weight: 600; + color: #1B2A3D; +} +.list-item div p{ + width: 80%; + font-size: 1vw; + color: #666; + margin-top: 5vh; +} + +.right-arrow{ + width: 95%; + /* height: 30vh; */ + text-align: center; + /* background: palegoldenrod; */ + display: flex; + align-items: center; + justify-content: center; +} +.right-arrow img{ + width: 18vw; + height: auto; +} +.left-arrow { + width: 20vw; /* 根据实际需要设置 */ + height: auto; + transform: scaleX(-1); /* 或 rotate(180deg) */ + } +/* ------------------服务能力--------------------- */ +.serviceProcess{ + width: 100%; + height: 150vh; + background: linear-gradient(to bottom, #397FF9 0%,#397FF9 50%, #5CB1E5 100%); + padding-top: 10vh; + + } +.serviceProcess h3{ + width: 100%; + font-size: 3vw; + font-weight: 400; + color: #fff; + text-align: center; +} +.serviceProcess p{ + width: 100%; + font-size: 0.9vw; + color: rgba(255, 255, 255, 0.9); + text-align: center; + margin-top: 3vh; +} + +.process-list{ + width: 90%; + height: 100vh; + margin: 0 auto; + display: flex; + align-items: center; + justify-content: center; + margin-top: 3vh; + flex-wrap: wrap; +} + +.process-item{ + width: 24vw; + height: 53vh; + background: #fff; + list-style: none; + margin-left: 3vw; + border-radius: 18px; + box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.1); + box-sizing: border-box; + padding: 2vw; + text-align: center; + position: relative; + margin-top: 8vh; +} +.process-item img{ + width:auto; + height: 10vh; + margin-top: 2vh; +} +.process-item h3{ + font-size: 1.1vw; + color: #1B2A3D; + margin-top: 3vh; +} +.process-item h3 span{ + + font-weight: 600; + color: #1B2A3D; + margin-top: 3vh; +} + +.process-item p{ + margin: 0 auto; + width: 90%; + font-size: 0.95vw; + color: #666; + margin-top: 3vh; + text-align: justify; +} + +.processBth{ + width: 100%; + /* height: 8vh; */ + box-sizing: border-box; + text-align: center; + display: flex; + align-items: center; + justify-content: center; + position: absolute; + bottom: 5vh; + left: 0; +} + +.processBth a{ + display: inline-block; + width: 9vw; + height: 2.3vw; + background: #fff; + border-radius: 1vw; + background: #3478FD; + text-decoration: none; + display: flex; + align-items: center; + justify-content: center; + transition: all 0.3s ease; +} + +.processBth a span{ + font-size: 0.8vw; + color: #fff; + font-weight: 400; +} + +.processBth a img{ + width: 1vw; + height:auto; + margin: 0; + margin-left: 0.5vw; +} + +.processBth a:hover{ + transform: scale(1.05); +} + +/* ---------------- */ + +.serviceBox{ + width: 100%; + height: 30vh; + background: #f1f1f1; + } + .serviceBox-content{ + width: 60%; + height: 100%; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; + } + + .serviceBox-content img{ + + width: 16vw; + height: auto; + + } + + + + + + + + diff --git a/fengxiao/css/base.css b/fengxiao/css/base.css new file mode 100644 index 0000000..7c1f859 --- /dev/null +++ b/fengxiao/css/base.css @@ -0,0 +1,70 @@ +/* 所有标签的内外边距清零 */ +* { + margin: 0px; + padding: 0px; + /* css3盒子模型 */ + box-sizing: border-box; + font-family:DFKai-SB; +} +/* em 和 i 斜体的文字不倾斜 */ +em, +i { + font-style: normal +} +/* 去掉li 的小圆点 */ +/* li { + list-style: none +} */ +/* ul{ + list-style: none; +} */ + +img { + /* border 0 照顾低版本浏览器 如果 图片外面包含了链接会有边框的问题 */ + border: 0; + /* 取消图片底侧有空白缝隙的问题 */ + vertical-align: middle; +} + +button { + /* 当我们鼠标经过button 按钮的时候，鼠标变成小手 */ + cursor: pointer +} + +a { + color: #666; + text-decoration: none +} + +a:hover { + color: #c81623 +} + +button, +input { + /* "\5B8B\4F53" 就是宋体的意思 这样浏览器兼容性比较好 */ + font-family: Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif; + /* 默认有灰色边框我们需要手动去掉 */ +} + +body { + /* CSS3 抗锯齿形 让文字显示的更加清晰 */ + -webkit-font-smoothing: antialiased; + /* background-color: #fff; */ + /* font: 12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif; */ + /* color: #666 */ +} + +.hide, +.none { + display: none +} +/* 清除浮动 */ +.clearfix::after { + visibility: hidden; + clear: both; + display: block; + content: "."; + height: 0 +} + diff --git a/fengxiao/css/footer.css b/fengxiao/css/footer.css new file mode 100644 index 0000000..3792bd4 --- /dev/null +++ b/fengxiao/css/footer.css @@ -0,0 +1,124 @@ +.footer{ + width: 100%; + height: 60vh; + background: #1A2B3B; + background-image: url(../imgs/home/footerbg.png); + background-size: auto 100%; + background-position: right; + background-repeat: no-repeat; + box-sizing: border-box; +} + +.footer-list{ + width: 90%; + height: 90%; + display: flex; + align-items: center; + justify-content: space-around; + box-sizing: border-box; + /* margin: 0 auto; */ + /* background: palegoldenrod; */ +} + +.footer-list-item{ + width: 20vw; + height: 90%; + list-style: none; + /* background: palegoldenrod; */ + text-align: center; + padding-top: 12vh; + box-sizing: border-box; +} + +.footer-logo{ + width: 8vw; +} + +.footer-list-item-text{ + width: 100%; + font-size: 0.89vw; + color: rgba(255, 255, 255, 0.5); + text-align: justify; + /* padding-top: 2vh; */ + box-sizing: border-box; + line-height: 3vw; +} + +.item-textBOX{ + padding-top: 10vh; + width: 19vw; +} +.item-nav{ + color: #fff; + padding-top: 10vh; + text-align: left; + padding-left: 5vw; +} + + +.item-nav p:nth-of-type(1){ + font-size: 1.5vw; + font-weight: 400; + + +} + +.item-nav p:nth-of-type(2) { + font-size: 0.8vw; + color: rgba(255, 255, 255, 0.5); + +} + +.item-nav p:nth-of-type(3) { + font-size: 0.8vw; + color: rgba(255, 255, 255, 0.5); + +} + +.item-nav p:nth-of-type(2) a{ + font-size: 0.8vw; + color: rgba(255, 255, 255, 0.5); + + text-decoration: none; +} + +.item-nav p:nth-of-type(3) a{ + font-size: 0.8vw; + color: rgba(255, 255, 255, 0.5); + + text-decoration: none; +} + +.item-nav p a:hover{ + color: #4885FD; +} + +.item-nav p img{ + width: 1vw; + height: auto; + margin-right: 1vw; +} + + +/* .footer-list-item img{ + width: 100%; + height: 100%; +} */ +.footer-bottom{ + width: 98%; + margin: 0 auto; + padding: 0vw 3vw; + text-align: right; + color: rgba(255, 255, 255, 0.7); + font-size: 0.8vw; + box-sizing: border-box; + height: 4vh; + } + + .footer-bottom .record{ + color: rgba(255, 255, 255, 0.7); + } + + .footer-bottom .record:hover{ + color: #00A0D2; + } \ No newline at end of file diff --git a/fengxiao/css/header.css b/fengxiao/css/header.css new file mode 100644 index 0000000..d601338 --- /dev/null +++ b/fengxiao/css/header.css @@ -0,0 +1,322 @@ +.header{ + width: 100%; + height: 12vh; + display: flex; + align-items: center; + justify-content: space-between; + /* background: #fff; */ + background-color: rgba(241, 241, 241, 0.5); + z-index: 1000; + position: fixed; + top: 0; + left: 0; + right: 0; + transition: background 0.3s; + margin: 0; +} + + + .header.scrolled { + background-color: #fff; + box-shadow: 0 2px 16px rgba(0,0,0,0.04); /* 可选：加阴影提升层次 */ + } + +.logo{ + width: 20%; + height: 100%; + /* background: palegoldenrod; */ + display: flex; + align-items: center; + padding-left: 8vw; +} +.logo img{ + width: 8vw; + height: auto; +} + +.nav{ + width: 46%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; + padding-right: 8vw; + /* background: palegoldenrod; */ +} + +.nav-list{ + width: 100%; + height: 43%; + display: flex; + align-items: center; + justify-content: space-around; + /* background: paleturquoise; */ +} + +.nav-item{ + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; + +} + +.nav-item a{ + color: #1A2B3C; + font-size: 0.9vw; + position: relative; + text-decoration: none; + display: inline-block; +} + +.nav-item a.active { + + color: #3478FD; + + +} + +/* .nav-item a.active::before { + content: ''; + width: 100%; + height: 1px; + background: #00a0d1; + position: absolute; + bottom: -5px; + left: 0; + display: block; +} */ + +.nav-item a:hover{ + color: #3478FD; +} + +/* 下拉菜单 */ +.nav-dropdown { + position: relative; +} +.arrow { + margin-left: 4px; + font-size: 0.8em; +} + + +.dropdown-menu li { + padding: 0; + list-style: none; + +} +.dropdown-menu li a { + display: flex; + align-items: center; + padding: 10px 24px; + color: #1A2B3C; + font-size: 1em; + white-space: nowrap; + transition: background 0.2s; + display: flex; + align-items: center; + justify-content: space-between; +} +.dropdown-menu li a:hover { + background: #f2f8fa; + color: #3478FD; +} +.dropdown-mask { + display: none; + position: fixed; + z-index: 1000; + left: 0; top: 0; right: 0; bottom: 0; + background: rgba(0,0,0,0.08); +} +/* 下拉激活时显示 */ +.nav-dropdown.open .dropdown-menu { + display: block; +} + +.dropdown-mask.active { + display: block; +} + +.arrow { + display: inline-block; + margin-left: 6px; + width: 0; + height: 0; + vertical-align: middle; + border-left: 5px solid transparent; + border-right: 5px solid transparent; + border-top: 5px solid #1A2B3C; + transition: transform 0.2s; +} +.nav-dropdown.open .arrow { + transform: rotate(180deg); + + border-top: 5px solid #3478FD; +} +.nav-dropdown a:hover .arrow,.nav-item a.active .arrow{ + border-top: 5px solid #3478FD; +} + +/* 下拉菜单动画 */ +.dropdown-menu { + display: block; /* 让动画生效，实际用visibility控制显示 */ + /* opacity: 0; */ + transform: translateY(10px); + visibility: hidden; + pointer-events: none; + transition: opacity 0.25s cubic-bezier(.4,0,.2,1), + transform 0.25s cubic-bezier(.4,0,.2,1), + visibility 0.25s; + position: absolute; + top: 8vh; + left: 0; + min-width:15vw; + background: #fff; + box-shadow: 0 4px 24px rgba(0,0,0,0.12); + border-radius: 8px; + z-index: 1001; + padding: 12px 0; +} +.nav-dropdown.open .dropdown-menu { + opacity: 1; + transform: translateY(0); + visibility: visible; + pointer-events: auto; +} + + +.dropdown-item{ + display: inline-block; + margin-left: 6px; + width: 0; + height: 0; + vertical-align: middle; + border-top: 5px solid transparent; + border-bottom: 5px solid transparent; + border-left: 5px solid #1A2B3C; + transition: transform 0.2s; + transition: all 0.2s; +} +.dropdown-item img{ + width: 50%; + height: auto; +} +/* hover 时去掉背景色，加边框 */ +.dropdown-menu li:hover .dropdown-item { + transform: scale(1.1); + border-left: 5px solid #3478FD; +} + +.dropdown-menu li:hover .dropdown-item img { + filter: brightness(0) saturate(100%) invert(41%) sepia(99%) saturate(749%) hue-rotate(162deg) brightness(97%) contrast(101%); + transition: all 0.3s ease; +} +/* 联系我们 */ +.contactUs{ + + border-radius: 30px; + transition: box-shadow 0.2s, background 0.3s,transform 0.2s; + background: #3478FD; + margin-left: 6vw; +} + +.contactUs:focus, +.contactUs:hover { + box-shadow: 0 8px 24px rgba(26, 109, 197, 0.22); + /* background: linear-gradient(100deg, #4fd7fa 0%, #2a7be0 100%); */ + transform: translateY(-2px) scale(1.03); +} + +.contactUs .contactUs-email { + transition: + box-shadow 0.2s, + background 0.2s, + transform 0.2s; +} + +.contactUs:focus .contactUs-email, +.contactUs:hover .contactUs-email { + /* background: #e6f7ff; */ + /* box-shadow: 0 0 0 4px rgba(54,198,240,0.15); */ + transform: scale(1.12) rotate(-6deg); +} + + +.contactUs a{ + width: 100%; + height: 100%; + color: #fff; + display: inline-block; + display: flex; + align-items: center; + justify-content: center; + /* background: palevioletred; */ + +} + +.contactUs a span { + transition: color 0.2s, font-weight 0.2s; + font-size: 0.8vw; +} + +.contactUs:focus a span, +.contactUs:hover a span { + color: #fff; + font-weight: 600; +} + +.contactUs-email{ + display: flex; + align-items: center; + justify-content: center; + width: 1.6vw; + height: 1.6vw; + border-radius: 50%; + /* background: #fff; */ + margin-left: 0.5vw; +} + +.contactUs-email img{ + width: 60%; + height: auto; +} + + + + + +/* 让 menu-active 和 hover 效果一致 */ +.dropdown-menu li a.menu-active, +.dropdown-menu li a:hover { + background: #f2f8fa; + color: #3478FD; +} + +/* 图标边框和滤镜一致 */ +.dropdown-menu li a.menu-active .dropdown-item, +.dropdown-menu li a:hover .dropdown-item { + + display: inline-block; + margin-left: 6px; + width: 0; + height: 0; + vertical-align: middle; + border-top: 5px solid transparent; + border-bottom: 5px solid transparent; + border-left: 5px solid #3478FD; + transition: transform 0.2s; + transition: all 0.2s; + /* transform: scale(1.1); */ +} + +.dropdown-menu li a.menu-active .dropdown-item img, +.dropdown-menu li a:hover .dropdown-item img { + filter: brightness(0) saturate(100%) invert(41%) sepia(99%) saturate(749%) hue-rotate(162deg) brightness(97%) contrast(101%); + transition: all 0.3s ease; +} + + + + diff --git a/fengxiao/css/index.css b/fengxiao/css/index.css new file mode 100644 index 0000000..7f40751 --- /dev/null +++ b/fengxiao/css/index.css @@ -0,0 +1,550 @@ +body{ + margin: 0; + padding: 0; + background:#F1F1F1; + padding-top: 12vh; +} + +*{ + margin: 0; + padding: 0; +} + + + +.banner{ + width: 88%; + height: 85vh; + margin: 0 auto; + display: flex; + align-items: center; + justify-content: space-around; +} +.banner-left{ + width: 86%; + height: 100%; + /* background: palegoldenrod; */ + padding: 1vw; + position: relative; +} +.banner-left-video{ + border-radius: 18px; + overflow: hidden; + width: 100%; + height: 70vh; + +} + +.banner-left-title{ + width: 50%; + /* height: 10vh; */ + /* background: palevioletred; */ + position: absolute; + bottom: 10vw; + left:5vw; + color: #fff; +} + +.banner-left-title p{ + font-size: 4vw; + font-weight: bold; + margin: 0; + font-weight: 400; + padding: 0; +} +.banner-left-title p:last-child{ + font-size: 0.8vw; + color: rgba(255, 255, 255, 0.8); +} + +.banner-left-button{ + position: absolute; + bottom: 10vw; + right:5vw; + background: #fff; + padding: 0.4vw 1vw; + border-radius: 30px; + display: flex; + align-items: center; + cursor: pointer; + box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); + transition: all 0.2s; +} +.banner-left-button:hover{ + transform: scale(1.05); +} + +.banner-left-button:hover .right-arrow{ + border-left: 8px solid #3478FD; + } + + .banner-left-button:hover a{ + color: #3478FD; + } +.banner-left-button a{ + text-decoration: none; + font-size: 0.9vw; + font-weight: 400; + color: #1A2B3C; +} +.right-arrow{ + display: inline-block; + margin-left: 6px; + width: 0; + height: 0; + vertical-align: middle; + border-top: 8px solid transparent; + border-bottom: 8px solid transparent; + border-left: 8px solid #1A2B3C; + transition: transform 0.2s; + transition: all 0.2s; +} + + + + +.banner-right{ + width: 30%; + height: 100%; + position: relative; + /* background: palevioletred; */ +} + +.banner-right-top,.banner-right-bottom{ + width: 90%; + height: 40%; + /* background: paleturquoise; */ +} + +.banner-right-top img{ + width: auto; + height: 100%; +} + +.banner-right-bottom{ + margin-top: 1vw; +} + +.banner-right-bottom img{ + width: auto; + height: 100%; +} + +.right-button-top{ + position: absolute; + height: 2.5vh; + top: 24vh; + right: 4vw; + bottom: 0; +} + +.right-button{ + position: absolute; + bottom: 10vw; + right: 4vw; +} + + +/* -------------------------------- */ + +.business{ + width: 100%; + height: 80vh; + margin: 0 auto; + display: flex; + align-items: center; + justify-content: center; + background: transparent; + background-image: url(../imgs/home/bg1.svg), url(../imgs/home/bg2.svg); + background-size: 100% 75%, 80% 90%; /* 每个背景图片的尺寸 */ + background-repeat: no-repeat, no-repeat; /* 每个背景图片是否平铺 */ + background-position: 100% 180%,222% 180%; /* 每个背景图片的位置 */ + +} + +/* business区主内容布局 */ +.business-content { + width: 88%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; + padding: 3vw 4vw; + + +} + +.business-text { + width: 50%; + box-sizing: border-box; + display: flex; + flex-direction: column; + justify-content: center; + color: #1A2B3C; + /* background: palegoldenrod; */ + margin-right: 3vw; + padding-left: 10%; +} +.business-text h2 { + width: 60%; + font-size: 5vw; + font-weight: 500; + margin-bottom: 1.2vw; +} +.business-text .subtitle { + width: 80%; + font-size: 1vw; + color: #5B5B5B; + margin-bottom: 2vw; + text-align: justify; + font-weight: 500; +} +.business-btn { + width: 5vw; + display: inline-block; + background: #3478FD; + color: #fff; + border-radius: 24px; + padding: 0.6vw 2vw; + font-size: 1vw; + font-weight: 500; + text-decoration: none; + box-shadow: 0 2px 8px rgba(52,120,253,0.08); + transition: background 0.2s, box-shadow 0.2s, color 0.2s; + text-align: center; + transition: all 0.2s; +} +.business-btn:focus, +.business-btn:hover { + color: #fff; + box-shadow: 0 4px 16px rgba(52,120,253,0.18); + transform: scale(1.05); +} + +.business-gallery { + width: 45%; + height: 32vw; + min-height: 420px; + position: relative; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; + /* background: palegreen; */ +} +.gallery-list { + position: absolute; + top: 0; + left: 0; + width: 100%; + display: flex; + flex-direction: column; + align-items: center; + transition: transform 0.8s cubic-bezier(.4,0,.2,1);} +.gallery-list img { + width: auto; + + height: 23vw; + object-fit: cover; + border-radius: 18px; + box-shadow: 0 4px 24px rgba(52,120,253,0.10); + margin-bottom: 2vw; + background: #f6f8fa; + transition: box-shadow 0.2s, filter 0.2s; +} +.gallery-list img:last-child { + margin-bottom: 0; +} + +/* 遮罩层 */ +.gallery-mask { + position: absolute; + left: 0; + width: 98%; + height: 48px; + pointer-events: none; + z-index: 2; +} +.gallery-mask.top { + + + top: -3px; + background: + /* 主扩散渐变 */ + linear-gradient(to bottom, rgba(241,241,241,0.92) 60%, rgba(241,241,241,0.0) 100%), + /* 两侧椭圆扩散 */ + radial-gradient(ellipse at 20% 0%, rgba(241,241,241,0.5) 0%, rgba(241,241,241,0) 80%), + radial-gradient(ellipse at 80% 0%, rgba(241,241,241,0.5) 0%, rgba(241,241,241,0) 80%); + filter: blur(2px); + } + + .gallery-mask.bottom { + + bottom: -3px; + background: + linear-gradient(to top, rgba(241,241,241,0.92) 60%, rgba(241,241,241,0.0) 100%), + radial-gradient(ellipse at 20% 100%, rgba(241,241,241,0.5) 0%, rgba(241,241,241,0) 80%), + radial-gradient(ellipse at 80% 100%, rgba(241,241,241,0.5) 0%, rgba(241,241,241,0) 80%); + filter: blur(2px); + } +/* -----------------AI模型------------------------------- */ + +.aimodel{ + width: 100%; + min-height: 100vh; + margin: 0 auto; + position: relative; + + + +} +.aimodel-bg{ + /* width: 100%; */ + + /* background: palegoldenrod; */ + margin: 0; + + background: + linear-gradient( + to bottom, + #55BEFF 0%, + #55BEFF 80%, + #f1f1f1 100% + ), + url(../imgs/home/bg3.svg); + + background-size: 100% 100%, 100% 50%; /* 渐变和图片都铺满 */ + background-repeat: no-repeat, no-repeat; + background-position: 0 0, 100% 50%; + +} + +.aimodel-content{ + width: 88%; + /* height: 100%; */ + margin: 0 auto; + padding-top: 8vh; + /* background: paleturquoise; */ +} + +.aimodel-top{ + width: 100%; + height: 58vh; + display: flex; + justify-content: center; + /* background: palegoldenrod; */ + padding-left: 5vw; + overflow: hidden; +} + +.aimodel-top-left{ + width: 32vw; + height: 100%; + /* background: palegoldenrod; */ +} + +.aimodel-top-left img{ + width: 32vw; + height: auto; + object-fit: cover; +} + +.aimodel-text{ + width: 40vw; + height: 100%; + /* background: palegoldenrod; */ + display: flex; + flex-direction: column; + justify-content: center; + color: #1A2B3C; + /* background: palegoldenrod; */ + margin-right: 1vw; + padding-left: 6%; +} + +.aimodel-text h2{ + width: 33vw; + font-size: 4.5vw; + font-weight: 500; + color: #fff; + margin: 0; + +} + +.aimodel-text .subtitle{ + width: 32vw; + font-size: 0.95vw; + margin: 0; + margin: 5vh 0; + text-align: justify; + line-height: 3vh; + color: #444444; +} + +.aimodel-bottom{ + width: 100%; + height: 100vh; + /* background: palegreen; */ +} + +.aimodel-bottom-list{ + width: 100%; + height: 60vh; + display: flex; + align-items: center; + justify-content: space-around; + flex-wrap: wrap; +} + +.aimodel-bottom-list li{ + width: 48%; + height: 35vh; + background: #FFFFFF; + margin-top: 5vh; + list-style: none; + border-radius: 18px; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; +} + +.list-item-imgBox{ + width: 15vw; + /* background: palegoldenrod; */ + height: 90%; + display: flex; + align-items: center; + justify-content: left; +} + +.list-item-imgBox img{ + width:auto; + height: 80%; + +} + +.list-item-text{ + width: 20vw; + height: 100%; + padding-top: 10vh; +} + +.list-item-text h3{ + font-size: 1.5vw; + font-weight: 500; + color: #1A2B3C; +} + +.list-item-text p{ + font-size: 1.1vw; + color: #5B5B5B; + margin-top: 1vh; +} + + +.section-divider-img { + position: absolute; /* 或 absolute/fixed，视你的布局而定 */ + display: block; + width: 100%; /* 或你想要的宽度 */ + height: auto; + margin-top: -40px; /* 让图片上移，覆盖在两个色块交界处 */ + z-index: 10; /* 保证在背景色之上 */ + pointer-events: none; /* 避免挡住鼠标事件 */ + top: 58%; + left: 0; + } + + +/* 优势区 */ + +.advantage-bg{ + width: 100%; + height: 100vh; + background: #FFFFFF; + background: linear-gradient( + to top, + #f1f1f1 0%, /* 顶部蓝色 */ + #f1f1f1 80%, /* 蓝色到底部80% */ + #f1f1f1 100% /* 渐变到底部的灰色 */ + ); + /* background: palevioletred; */ + margin: 0; + /* margin-top: -1vw; */ + box-sizing: border-box; + overflow: hidden; + padding-top: 0; + + +} +.advantage-content{ + width: 88%; + height: 100%; + margin: 0 auto; + /* background: palegoldenrod; */ +} + +.advantage-content h2{ + width: 100%; + + font-size: 5vw; + font-weight: 500; + color: #1A2B3D; + text-align: center; +} + +.advantage-list{ + width: 100%; + height: 50vh; + display: flex; + align-items: center; + justify-content: space-around; + /* background: palegoldenrod; */ +} + +.advantage-list-item{ + width: 23vw; + height: 40vh; + background: #fff; + list-style: none; + border-radius: 18px; + overflow: hidden; + box-shadow: 5px 5px 10px 3px rgba(0, 0, 0, 0.1); + padding: 1vw; + box-sizing: border-box; + text-align: center; +} + +.advantage-list-item img{ + width: 17vw; + height: auto; +} + +.advantage-list-item p{ + width: 80%; + margin: 0 auto; + font-size: 1vw; + color: #5B5B5B; + margin-top: 1vh; + text-align: left; +} + +.advantage-list-item-img{ + width: 70%; + height: 10vh; + display: flex; + align-items: center; + justify-content: space-around; + margin: 0 auto; + padding-left: 2vw; + margin-top: 5vh; +} + +.advantage-list-item-img img{ + width: 16vw; + height: auto; +} + + + + diff --git a/fengxiao/css/technicalSupport.css b/fengxiao/css/technicalSupport.css new file mode 100644 index 0000000..449e418 --- /dev/null +++ b/fengxiao/css/technicalSupport.css @@ -0,0 +1,263 @@ +* ,body{ + margin: 0; + padding: 0; + /* box-sizing: border-box; */ +} + + +.banner{ + width: 100%; + height: 100vh; + + /* background: linear-gradient(to bottom, #3A8DFF 0%, #AEE6FF 60%, #F1F1F1 100%), + url(../imgs/support/bg.png); */ + + background: linear-gradient( + to bottom, + #3478FD 0%, + #BED0F4 88%, + #f1f1f1 100% + ); + + /* background: url(../imgs/support/bg.png) no-repeat bottom; */ + background-size: 100% 80%; + background-repeat: no-repeat; + background-size: cover; + background-position: top, center; + box-sizing: border-box; + background-blend-mode: multiply; + margin-top: 12vh; +} + +.banner-content{ + width: 100%; + height: 100%; + background-image: url(../imgs/support/bg.png); + background-size: 112% 72%; + background-position: 76% 123%; + background-repeat: no-repeat; + box-sizing: border-box; + position: relative; +} + +.banner-content-text{ + position: absolute; + top: 8vw; + left: 33vw; + width: 30%; + height: 50%; + /* background: palegoldenrod; */ + +} + +.banner-content-text p:nth-child(1){ + font-size: 5vw; + font-weight: 300; + color: #fff; +} + +.banner-content-text p:nth-child(2){ + font-size: 1.25vw; + margin-top: 2vh; + color: rgba(0,0,0,0.6); + line-height: 5vh; + font-weight: 450; + /* color: #fff; */ + +} + +.banner-content-list { + width: 100%; + height: 90vh; + background: linear-gradient( + to bottom, + #f1f1f1 0%, + #C0E1F5 100% + ); + position: relative; + + + + } + + .banner-content-list h2{ + font-size: 2.5vw; + font-weight: 400; + text-align: center; + text-decoration: underline; + text-underline-offset: 0.5vw; + text-decoration-thickness: 0.1vw; + color: rgba(0, 0, 0, 0.8); + } + + .content-listBOX{ + width: 80%; + height: 80%; + /* background: palegoldenrod; */ + margin-top: 5vh; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; + } + + .content-listBOX-item{ + width: 23vw; + height: 80%; + /* background: palegoldenrod; */ + list-style: none; + border-radius: 1vw; + box-shadow: 8px 5px 10px 5px rgba(0,0,0,0.1); + background: #fff; + padding: 2vw; + box-sizing: border-box; + text-align: center; + } + + .content-listBOX-item img{ + width: 10vw; + height: 8vw; + margin: 0 auto; + } + + .content-listBOX-item h3{ + font-size: 1.5vw; + font-weight: 500; + margin-top: 1vh; + } + + .content-listBOX-item p{ + font-size: 0.85vw; + font-weight: 400; + width: 80%; + text-align: justify; + margin: 0 auto; + margin-top: 2vh; + color: rgba(0,0,0,0.8); + } + + + + + /* ---------------大模型训练-------------------------- */ + + .largeModel{ + width: 100%; + height: 80vh; + font-size: 40px; + display: flex; + align-items: center; + justify-content: center; + background: linear-gradient( + to bottom, + #367BFC 0%, + #5DB6EE 100% + ); + } + + .largeModel-bg{ + width: 100%; + height: 100%; + background: url(../imgs/support/left.png) ,url(../imgs/support/right.png); + background-size: 50% 148%,39% 132%; + background-repeat: no-repeat; + background-position: -60% 54%,134% 3%; + color: #fff; + } + .largeModel-bg h2{ + font-size: 3.5vw; + font-weight: 400; + text-align: center; + margin-top: 5vh; + } + + .largeModel-bg h4{ + font-size: 1vw; + font-weight: 400; + text-align: center; + color: rgba(255,255,255,0.8); + } + + .largeModel-bg-content{ + width: 58%; + height: 55%; + background: #fff; + margin: 0 auto; + margin-top: 5vh; + border-radius: 1vw; + padding: 2vw; + box-sizing: border-box; + + } + + .largeModel-bg-content h3{ + font-size: 1.8vw; + font-weight: 600; + text-align: center; + color: rgba(0,0,0,0.8); + + } + + .largeModel-bg-content p{ + font-size: 1vw; + font-weight: 400; + text-align: center; + color: rgba(0,0,0,0.8); + margin-top: 1vh; + } + + .largeModel-bg-content-list{ + width: 80%; + height: 40%; + display: flex; + justify-content: left; + align-items: center; + color: rgba(0,0,0,0.8); + flex-wrap: wrap; + margin: 0 auto; + padding-left: 2vw; + /* background: palegoldenrod; */ + margin-top: 5vh; + } + + .largeModel-bg-content-list li{ + /* list-style-type: disc; */ + width: 25%; + font-size: 1vw; + font-weight: 400; + margin-left: 1vw; + position: relative; + padding-left: 1.5vw; + list-style: none; + } + + .largeModel-bg-content-list li::before { + content: ""; + position: absolute; + left: 0; + top: 50%; + transform: translateY(-50%); + width: 0.6vw; + height: 0.6vw; + background-color: #367BFC; + border-radius: 50%; + } + + + /* ------------------------- */ + + .serviceBox{ + width: 100%; + height: 30vh; + background: #f1f1f1; + } + .serviceBox-content{ + width: 60%; + height: 100%; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; + } + + diff --git a/fengxiao/css/websiteDesign.css b/fengxiao/css/websiteDesign.css new file mode 100644 index 0000000..ff6dba5 --- /dev/null +++ b/fengxiao/css/websiteDesign.css @@ -0,0 +1,493 @@ +.banner{ + width: 100%; + height: 160vh; + box-sizing: border-box; + + + padding-top: 12vh; + + /* background: linear-gradient(to bottom, rgba(245, 245, 245, 1) 0%,#C0E0F5 60%, #C0E0F5 100%); */ + + background: linear-gradient(to bottom, rgba(241, 241, 241, 1) 12vh,#C0E0F5 90vh, #C0E0F5 100%); + +} +body,*{ + margin: 0; + padding: 0; +} + +.banner-top{ + width: 100%; + height: 70vh; + background-image: url(../imgs/website/bg.png); + background-size: 38vw auto; + background-position: 89% 0vw; + background-repeat: no-repeat; + margin: 0; +} +.banner-top-content{ + box-sizing: border-box; + width: 35%; + height: 60%; + margin-left: 15vw; + color: #1A2B3D; + font-weight: 400; + padding-top: 5vw; +} +.banner-top-content p:nth-child(1){ + font-size: 5vw; + margin: 0; + + +} +.banner-top-content p:nth-child(2){ + font-size: 5vw; + margin: 0; + +} +.banner-top-content p:nth-child(3){ + font-size: 0.95vw; + margin: 0; + color: rgba(0, 0, 0, 0.7); + width: 88%; + margin-top: 1vh; + +} + +/* .banner-bottom{ + width: 100%; + height: 70vh; +} + + +.carousel-container { + position: relative; + width: 900px; + height: 380px; + margin: 0 auto; + overflow: hidden; + background: transparent; + display: flex; + align-items: center; + justify-content: center; +} +.carousel-track { + display: flex; + transition: transform 0.6s cubic-bezier(.4,0,.2,1); + height: 100%; +} +.carousel-item { + width: 280px; + height: 340px; + background: #fff; + border-radius: 24px; + box-shadow: 0 4px 24px rgba(0,0,0,0.10); + margin: 0 30px; + flex-shrink: 0; + display: flex; + flex-direction: column; + align-items: center; + justify-content: flex-start; + overflow: hidden; +} +.carousel-item img { + width: 100%; + height: 75%; + object-fit: cover; + border-radius: 24px 24px 0 0; +} +.carousel-caption { + width: 100%; + text-align: center; + font-size: 20px; + color: #222; + margin-top: 24px; + font-weight: 400; + letter-spacing: 1px; +} +.carousel-fade { + position: absolute; + top: 0; + width: 120px; + height: 100%; + z-index: 2; + pointer-events: none; +} +.carousel-fade.left { + left: 0; + background: linear-gradient(to right, #c0e0f5 80%, rgba(192,224,245,0)); +} +.carousel-fade.right { + right: 0; + background: linear-gradient(to left, #c0e0f5 80%, rgba(192,224,245,0)); +} +.carousel-dots { + position: absolute; + left: 50%; + bottom: 24px; + transform: translateX(-50%); + display: flex; + gap: 16px; + z-index: 3; +} +.carousel-dots .dot { + width: 16px; + height: 16px; + border-radius: 50%; + background: #fff; + opacity: 0.5; + transition: opacity 0.3s, background 0.3s; +} +.carousel-dots .dot.active { + background: #3478FD; + opacity: 1; +} */ + + + + + +.banner-bottom { + width: 100%; + height: 70vh; + display: flex; + align-items: center; + justify-content: center; + /* background: #f5f9fc; */ + position: relative; + +} + +.carousel-container { + position: relative; + width: 80%; + /* height: 400px; */ + margin: 0 auto; + overflow: hidden; + display: flex; + align-items: center; +} + +.carousel-track { + display: flex; + transition: transform 0.8s cubic-bezier(0.16, 0.77, 0.58, 0.97); + height: 100%; + align-items: center; +} + +.carousel-item { + width: 28vw; + height: 55vh !important; + + border-radius: 20px; + box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); + margin: 0 20px; + flex-shrink: 0; + display: flex; + flex-direction: column; + align-items: center; + overflow: hidden; + position: relative; + background: #fff; + box-sizing: border-box; + padding: 1vw; +} + +/* 确保中间图片完全清晰的关键修改 */ +.carousel-item img { + width: 100%; + height: 80%; + object-fit: cover; + border-radius: 20px 20px 0 0; + /* 明确设置无滤镜 */ + filter: none !important; +} + +/* 仅对两侧卡片应用模糊效果 */ +.carousel-item.left-side img, +.carousel-item.right-side img { + filter: blur(2px) brightness(0.9); + opacity: 0.8; +} + +/* 中间卡片保持原始状态 */ +.carousel-item.center { + box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15); + /* 确保不继承任何模糊效果 */ + filter: none !important; +} + +.carousel-caption { + width: 100%; + padding: 20px; + text-align: center; + font-size: 18px; + color: #444444; + font-weight: 500; + background: #fff; + margin-top: 5vh; +} + +/* 渐变遮罩 */ +.carousel-fade { + position: absolute; + top: 0; + width: 28vw; + height: 100%; + z-index: 5; + pointer-events: none; +} + +.carousel-fade.left { + width: 50vw; + left: 0; + background: linear-gradient(to right, #C0E0F5 0%, #C0E0F5 10%, rgba(207, 231, 246, 0) 80%); +} + +.carousel-fade.right { + right: 0; + background: linear-gradient(to left, rgba(194, 225, 245, 1) 0%, rgba(245, 249, 252, 0) 80%); +} + +/* 指示点放在盒子外部 */ +.carousel-dots { + position: absolute; + left: 56%; + bottom: -40px; + transform: translateX(-50%); + display: flex; + gap: 12px; + z-index: 8; + /* background: red; */ +} + +.carousel-dots .dot { + width: 1vw; + height: 1vw; + border-radius: 50%; + background:#fff; + cursor: pointer; + transition: all 0.3s ease; +} + +.carousel-dots .dot.active { + background: rgba(255, 255, 255, 0.5); + transform: scale(1.2); +} +/* --------------网站策划与原型设计--------------------- */ +.website-design-content{ + width: 100%; + height: 370vh; + background-color: #f1f1f1; + background-image: url(../imgs/home/bg1.svg); + background-size: 100% auto; + background-position: 89% 106%; + background-repeat: no-repeat; + padding-top: 25vh; +} +.list-item{ + width: 80%; + height: 50vh; + flex-shrink: 0; + margin: 0 auto; + box-sizing: border-box; + display: flex; + align-items: center; + + /* background: palegoldenrod; */ + +} + +.list-item img{ + width: 35vw; + height:auto; +} +.list-item div{ + width: 40vw; + height:auto; + margin-left: 10vw; +} +.list-item div h3{ + font-size: 1.8vw; + font-weight: 600; + color: #1B2A3D; +} +.list-item div p{ + width: 70%; + font-size: 1vw; + color: #666; + margin-top: 5vh; +} + +.right-arrow{ + width: 95%; + /* height: 30vh; */ + text-align: center; + /* background: palegoldenrod; */ + display: flex; + align-items: center; + justify-content: center; +} +.right-arrow img{ + width: 18vw; + height: auto; +} +.left-arrow { + width: 20vw; /* 根据实际需要设置 */ + height: auto; + transform: scaleX(-1); /* 或 rotate(180deg) */ + } + + + /* ------------------服务流程--------------------- */ + .serviceProcess{ + width: 100%; + height: 78vh; + background: linear-gradient(to bottom, #397FF9 0%,#397FF9 50%, #5CB1E5 100%); + padding-top: 10vh; + + } +.serviceProcess h3{ + width: 100%; + font-size: 3vw; + font-weight: 400; + color: #fff; + text-align: center; +} +.serviceProcess p{ + width: 100%; + font-size: 0.9vw; + color: rgba(255, 255, 255, 0.9); + text-align: center; + margin-top: 3vh; +} + +.process-list{ + width: 90%; + height: 48vh; + margin: 0 auto; + display: flex; + align-items: center; + justify-content: center; + margin-top: 3vh; +} + +.process-item{ + width: 18vw; + height: 100%; + background: #fff; + list-style: none; + margin-left: 2vw; + border-radius: 18px; + box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.1); + box-sizing: border-box; + padding: 2vw; + text-align: center; + position: relative; +} +.process-item img{ + width:auto; + height: 10vh; + margin-top: 3vh; +} +.process-item h3{ + font-size: 1.5vw; + font-weight: 600; + color: #1B2A3D; + margin-top: 3vh; +} +.process-item p{ + margin: 0 auto; + width: 82%; + font-size: 0.95vw; + color: #666; + margin-top: 4vh; + text-align: justify; +} + + + + + + + +.process-item-number { + position: absolute; + top: -2.5vw; + left: 5.3vw; + width: 5vw; + height: 5vw; + display: flex; + align-items: center; + justify-content: center; + z-index: 1; + } + + .process-item-number::before, + .process-item-number::after { + content: ""; + position: absolute; + left: 50%; + top: 50%; + border-radius: 50%; + transform: translate(-50%, -50%); + z-index: 0; + } + + .process-item-number::before { + width: 4.5vw; + height: 4.5vw; + background: rgba(0, 255, 255, 0.15); /* 外层淡青色光晕 */ + } + + .process-item-number::after { + width: 3.9vw; + height: 3.9vw; + background: rgba(0, 255, 255, 0.25); /* 中层稍深光晕 */ + } + + .process-item-number span { + display: flex; + align-items: center; + justify-content: center; + width: 3.2vw; + height: 3.2vw; + border-radius: 50%; + background: #00E6E6; /* 主体青色 */ + color: #222; + font-size: 1vw; + font-weight: 500; + z-index: 1; + box-shadow: 0 0 12px 0 rgba(22,230,248,0.18); + font-family: 'Arial', 'Helvetica Neue', Arial, sans-serif; + font-style: italic; + + +} +/* ---------------- */ + +.serviceBox{ + width: 100%; + height: 30vh; + background: #f1f1f1; + } + .serviceBox-content{ + width: 60%; + height: 100%; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; + } + + .serviceBox-content img{ + + width: 16vw; + height: auto; + + } + + + + + diff --git a/fengxiao/html/aboutUs.html b/fengxiao/html/aboutUs.html new file mode 100644 index 0000000..ec10736 --- /dev/null +++ b/fengxiao/html/aboutUs.html @@ -0,0 +1,161 @@ + + + + + + + + + + + 深圳丰潇 + + + + +
+ +
+ + +
+
+ + +
+ + + +
+
+ +
+ 深圳丰潇技术服务有限公司是一家专注于网站设计与 AI 模型训练的企业，为客户提供全方位的技术服务支持。我们秉承“专业、创新、高效”的理念，致力于帮助客户实现业务目标，提升企业竞争力。 +
+ +
+
+ + +
+ + +
+ + + + + +
+ +
+

Copyright ©深圳丰潇技术服务有限公司    版权所有

+
+
+ + + + + \ No newline at end of file diff --git a/fengxiao/html/aimodel.html b/fengxiao/html/aimodel.html new file mode 100644 index 0000000..364f085 --- /dev/null +++ b/fengxiao/html/aimodel.html @@ -0,0 +1,300 @@ + + + + + + + + + + + 深圳丰潇 + + + + + +
+ +
+ + +
+
+ + +
+ + + + +
+
+ AI 场景需求分析 +
+

AI 场景需求分析

+

明确业务目标，匹配适用模型类别（如 NLP、CV、推荐等）

+
+
+ + +
+ arrow +
+ + +
+
+

数据处理与标注

+

数据清洗、格式规范、智能与人工混合标注服务

+
+ 数据处理与标注 +
+ +
+ arrow +
+ +
+ 模型训练与优化 +
+

模型训练与优化

+

支持 PyTorch/TensorFlow 等框架，结合 GPU 加速与 AutoML 超参优化

+
+
+
+ arrow +
+
+
+

模型服务化部署

+

封装为 API，支持本地或云端部署，提供调用认证、权限控制与限流服务

+
+ 模型服务化部署 +
+
+ arrow +
+ +
+ 业务系统集成 +
+

业务系统集成

+

接入现有 CRM、ERP、OA 等系统，实现数据回流与模型迭代闭环

+
+
+ +
+ + +
+

我们的服务流程

+

客户满意是我们工作的目标，不断超越客户的期望值来自于我们对这个行业的热爱。

+ + + + +
+
+
+ 7*24小时服务 + 专业技术服务 + 全周期解决方案 + +
+
+ + + + + +
+ +
+

Copyright ©深圳丰潇技术服务有限公司    版权所有

+
+
+ + + + + \ No newline at end of file diff --git a/fengxiao/html/technicalSupport.html b/fengxiao/html/technicalSupport.html new file mode 100644 index 0000000..56416a9 --- /dev/null +++ b/fengxiao/html/technicalSupport.html @@ -0,0 +1,174 @@ + + + + + + + + + + + 深圳丰潇 + + + + +
+ +
+ + +
+
+ + +
+ + + + + + +
+
+ +

大模型训练与接入技术服务

+

大模型专家团队，健全的大模型服务体系，丰富的大模型服务经验，以客户为中心的服务理念

+
+

五大类服务

+

帮助您快速实现大模型AI训练与接入

+
    +
  • AI场景需求分析
    • +
  • 模型服务化部署
    • +
  • 数据处理与标注
    • +
  • 业务系统集成
    • +
  • 模型训练与优化
    • +
+
+ +
+
+ +
+
+ 7*24小时服务 + 专业技术服务 + 全周期解决方案 + +
+
+ +
+ +
+

Copyright ©深圳丰潇技术服务有限公司    版权所有

+
+
+ + + + + \ No newline at end of file diff --git a/fengxiao/html/websiteDesign.html b/fengxiao/html/websiteDesign.html new file mode 100644 index 0000000..9530cd8 --- /dev/null +++ b/fengxiao/html/websiteDesign.html @@ -0,0 +1,245 @@ + + + + + + + + + + + 深圳丰潇 + + + + + +
+ +
+ + +
+
+ + +
+ + + +
+
+ 网站策划与原型设计 +
+

网站策划与原型设计

+

需求调研、用户体验分析、信息架构设计、原型图设计

+
+
+ + +
+ arrow +
+ + +
+
+

UI 视觉设计

+

品牌风格提取、界面视觉统一、组件系统构建、高保真稿输出

+
+ UI 视觉设计 +
+ +
+ arrow +
+ +
+ 前端开发 +
+

前端开发

+

采用 Vue/React 框架构建响应式页面，兼容多终端设备，进行性能优化与 SEO 支持

+
+
+
+ arrow +
+
+
+

后端开发

+

基于 Node.js (中小型项目) / Spring（企业级项目） 开发业务逻辑与 API 接口，支持 MySQL/MongoDB 数据库

+
+ 后端开发 +
+
+ arrow +
+ +
+ 系统部署与上线 +
+

系统部署与上线

+

部署至云服务器（如阿里云、腾讯云等），配置 CI/CD 流程，提供安全加固与监控运维支持

+
+
+ +
+ + +
+

我们的服务流程

+

客户满意是我们工作的目标，不断超越客户的期望值来自于我们对这个行业的热爱。

+ + + + +
+
+
+ 7*24小时服务 + 专业技术服务 + 全周期解决方案 + +
+
+ + + + + +
+ + +
+

Copyright ©深圳丰潇技术服务有限公司    版权所有

+
+
+ + + + + \ No newline at end of file diff --git a/fengxiao/imgs/about/adout1.png b/fengxiao/imgs/about/adout1.png new file mode 100644 index 0000000..d396470 Binary files /dev/null and b/fengxiao/imgs/about/adout1.png differ diff --git a/fengxiao/imgs/about/adout2.png b/fengxiao/imgs/about/adout2.png new file mode 100644 index 0000000..a18b0ef Binary files /dev/null and b/fengxiao/imgs/about/adout2.png differ diff --git a/fengxiao/imgs/about/bg.svg b/fengxiao/imgs/about/bg.svg new file mode 100644 index 0000000..6b2d8fe --- /dev/null +++ b/fengxiao/imgs/about/bg.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/about/bg2.svg b/fengxiao/imgs/about/bg2.svg new file mode 100644 index 0000000..c60ee80 --- /dev/null +++ b/fengxiao/imgs/about/bg2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/about/list1.jpg b/fengxiao/imgs/about/list1.jpg new file mode 100644 index 0000000..669eec9 Binary files /dev/null and b/fengxiao/imgs/about/list1.jpg differ diff --git a/fengxiao/imgs/about/list2.jpg b/fengxiao/imgs/about/list2.jpg new file mode 100644 index 0000000..0744963 Binary files /dev/null and b/fengxiao/imgs/about/list2.jpg differ diff --git a/fengxiao/imgs/about/list3.jpg b/fengxiao/imgs/about/list3.jpg new file mode 100644 index 0000000..637b726 Binary files /dev/null and b/fengxiao/imgs/about/list3.jpg differ diff --git a/fengxiao/imgs/home/advantage1.png b/fengxiao/imgs/home/advantage1.png new file mode 100644 index 0000000..4c5f1cf Binary files /dev/null and b/fengxiao/imgs/home/advantage1.png differ diff --git a/fengxiao/imgs/home/advantage2.png b/fengxiao/imgs/home/advantage2.png new file mode 100644 index 0000000..1321f82 Binary files /dev/null and b/fengxiao/imgs/home/advantage2.png differ diff --git a/fengxiao/imgs/home/advantage3.png b/fengxiao/imgs/home/advantage3.png new file mode 100644 index 0000000..ebcdcf7 Binary files /dev/null and b/fengxiao/imgs/home/advantage3.png differ diff --git a/fengxiao/imgs/home/ai.png b/fengxiao/imgs/home/ai.png new file mode 100644 index 0000000..1319d78 Binary files /dev/null and b/fengxiao/imgs/home/ai.png differ diff --git a/fengxiao/imgs/home/ailist1.png b/fengxiao/imgs/home/ailist1.png new file mode 100644 index 0000000..ac4787e Binary files /dev/null and b/fengxiao/imgs/home/ailist1.png differ diff --git a/fengxiao/imgs/home/ailist2.png b/fengxiao/imgs/home/ailist2.png new file mode 100644 index 0000000..156986f Binary files /dev/null and b/fengxiao/imgs/home/ailist2.png differ diff --git a/fengxiao/imgs/home/ailist3.png b/fengxiao/imgs/home/ailist3.png new file mode 100644 index 0000000..354078e Binary files /dev/null and b/fengxiao/imgs/home/ailist3.png differ diff --git a/fengxiao/imgs/home/ailist4.png b/fengxiao/imgs/home/ailist4.png new file mode 100644 index 0000000..808e322 Binary files /dev/null and b/fengxiao/imgs/home/ailist4.png differ diff --git a/fengxiao/imgs/home/aimodel.png b/fengxiao/imgs/home/aimodel.png new file mode 100644 index 0000000..5de865a Binary files /dev/null and b/fengxiao/imgs/home/aimodel.png differ diff --git a/fengxiao/imgs/home/bg1.svg b/fengxiao/imgs/home/bg1.svg new file mode 100644 index 0000000..c60ee80 --- /dev/null +++ b/fengxiao/imgs/home/bg1.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/home/bg2.svg b/fengxiao/imgs/home/bg2.svg new file mode 100644 index 0000000..e7b1ce2 --- /dev/null +++ b/fengxiao/imgs/home/bg2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/home/bg3.svg b/fengxiao/imgs/home/bg3.svg new file mode 100644 index 0000000..cf213db --- /dev/null +++ b/fengxiao/imgs/home/bg3.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/home/email.svg b/fengxiao/imgs/home/email.svg new file mode 100644 index 0000000..33a7e6d --- /dev/null +++ b/fengxiao/imgs/home/email.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/home/footerbg.png b/fengxiao/imgs/home/footerbg.png new file mode 100644 index 0000000..7824c72 Binary files /dev/null and b/fengxiao/imgs/home/footerbg.png differ diff --git a/fengxiao/imgs/home/footeremail.svg b/fengxiao/imgs/home/footeremail.svg new file mode 100644 index 0000000..e3fa5d2 --- /dev/null +++ b/fengxiao/imgs/home/footeremail.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/home/footerlogo.png b/fengxiao/imgs/home/footerlogo.png new file mode 100644 index 0000000..adc23e3 Binary files /dev/null and b/fengxiao/imgs/home/footerlogo.png differ diff --git a/fengxiao/imgs/home/list1.png b/fengxiao/imgs/home/list1.png new file mode 100644 index 0000000..25f24d7 Binary files /dev/null and b/fengxiao/imgs/home/list1.png differ diff --git a/fengxiao/imgs/home/list2.png b/fengxiao/imgs/home/list2.png new file mode 100644 index 0000000..b4e2e15 Binary files /dev/null and b/fengxiao/imgs/home/list2.png differ diff --git a/fengxiao/imgs/home/list3.png b/fengxiao/imgs/home/list3.png new file mode 100644 index 0000000..40d6720 Binary files /dev/null and b/fengxiao/imgs/home/list3.png differ diff --git a/fengxiao/imgs/home/logo.png b/fengxiao/imgs/home/logo.png new file mode 100644 index 0000000..8b9e7b4 Binary files /dev/null and b/fengxiao/imgs/home/logo.png differ diff --git a/fengxiao/imgs/home/logoicon.png b/fengxiao/imgs/home/logoicon.png new file mode 100644 index 0000000..8cb8111 Binary files /dev/null and b/fengxiao/imgs/home/logoicon.png differ diff --git a/fengxiao/imgs/home/newvision1.png b/fengxiao/imgs/home/newvision1.png new file mode 100644 index 0000000..9b4e9cd Binary files /dev/null and b/fengxiao/imgs/home/newvision1.png differ diff --git a/fengxiao/imgs/home/newvision2.png b/fengxiao/imgs/home/newvision2.png new file mode 100644 index 0000000..ba42f83 Binary files /dev/null and b/fengxiao/imgs/home/newvision2.png differ diff --git a/fengxiao/imgs/home/newvision3.png b/fengxiao/imgs/home/newvision3.png new file mode 100644 index 0000000..6f621cd Binary files /dev/null and b/fengxiao/imgs/home/newvision3.png differ diff --git a/fengxiao/imgs/home/positioning.svg b/fengxiao/imgs/home/positioning.svg new file mode 100644 index 0000000..6caa669 --- /dev/null +++ b/fengxiao/imgs/home/positioning.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/home/video.mp4 b/fengxiao/imgs/home/video.mp4 new file mode 100644 index 0000000..44dacaa Binary files /dev/null and b/fengxiao/imgs/home/video.mp4 differ diff --git a/fengxiao/imgs/home/website.png b/fengxiao/imgs/home/website.png new file mode 100644 index 0000000..6189abf Binary files /dev/null and b/fengxiao/imgs/home/website.png differ diff --git a/fengxiao/imgs/model/bg.png b/fengxiao/imgs/model/bg.png new file mode 100644 index 0000000..9539ed8 Binary files /dev/null and b/fengxiao/imgs/model/bg.png differ diff --git a/fengxiao/imgs/model/list1.jpg b/fengxiao/imgs/model/list1.jpg new file mode 100644 index 0000000..4fe2243 Binary files /dev/null and b/fengxiao/imgs/model/list1.jpg differ diff --git a/fengxiao/imgs/model/list2.jpg b/fengxiao/imgs/model/list2.jpg new file mode 100644 index 0000000..62593e0 Binary files /dev/null and b/fengxiao/imgs/model/list2.jpg differ diff --git a/fengxiao/imgs/model/list3.jpg b/fengxiao/imgs/model/list3.jpg new file mode 100644 index 0000000..d3df165 Binary files /dev/null and b/fengxiao/imgs/model/list3.jpg differ diff --git a/fengxiao/imgs/model/list4.jpg b/fengxiao/imgs/model/list4.jpg new file mode 100644 index 0000000..1824fbc Binary files /dev/null and b/fengxiao/imgs/model/list4.jpg differ diff --git a/fengxiao/imgs/model/list5.jpg b/fengxiao/imgs/model/list5.jpg new file mode 100644 index 0000000..c485304 Binary files /dev/null and b/fengxiao/imgs/model/list5.jpg differ diff --git a/fengxiao/imgs/model/mode1.png b/fengxiao/imgs/model/mode1.png new file mode 100644 index 0000000..36a4dad Binary files /dev/null and b/fengxiao/imgs/model/mode1.png differ diff --git a/fengxiao/imgs/model/mode2.png b/fengxiao/imgs/model/mode2.png new file mode 100644 index 0000000..f58d1b2 Binary files /dev/null and b/fengxiao/imgs/model/mode2.png differ diff --git a/fengxiao/imgs/model/mode3.png b/fengxiao/imgs/model/mode3.png new file mode 100644 index 0000000..33c2e0d Binary files /dev/null and b/fengxiao/imgs/model/mode3.png differ diff --git a/fengxiao/imgs/model/mode4.png b/fengxiao/imgs/model/mode4.png new file mode 100644 index 0000000..6c48282 Binary files /dev/null and b/fengxiao/imgs/model/mode4.png differ diff --git a/fengxiao/imgs/model/mode5.png b/fengxiao/imgs/model/mode5.png new file mode 100644 index 0000000..95f2ae8 Binary files /dev/null and b/fengxiao/imgs/model/mode5.png differ diff --git a/fengxiao/imgs/model/service1.svg b/fengxiao/imgs/model/service1.svg new file mode 100644 index 0000000..eecbfcb --- /dev/null +++ b/fengxiao/imgs/model/service1.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/model/service2.svg b/fengxiao/imgs/model/service2.svg new file mode 100644 index 0000000..3329861 --- /dev/null +++ b/fengxiao/imgs/model/service2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/model/service3.svg b/fengxiao/imgs/model/service3.svg new file mode 100644 index 0000000..8cc671d --- /dev/null +++ b/fengxiao/imgs/model/service3.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/model/service4.svg b/fengxiao/imgs/model/service4.svg new file mode 100644 index 0000000..607102b --- /dev/null +++ b/fengxiao/imgs/model/service4.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/model/service5.svg b/fengxiao/imgs/model/service5.svg new file mode 100644 index 0000000..6c9bb93 --- /dev/null +++ b/fengxiao/imgs/model/service5.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/model/service6.svg b/fengxiao/imgs/model/service6.svg new file mode 100644 index 0000000..1146103 --- /dev/null +++ b/fengxiao/imgs/model/service6.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/support/bg.png b/fengxiao/imgs/support/bg.png new file mode 100644 index 0000000..d58d909 Binary files /dev/null and b/fengxiao/imgs/support/bg.png differ diff --git a/fengxiao/imgs/support/left.png b/fengxiao/imgs/support/left.png new file mode 100644 index 0000000..5b779e2 Binary files /dev/null and b/fengxiao/imgs/support/left.png differ diff --git a/fengxiao/imgs/support/list1.svg b/fengxiao/imgs/support/list1.svg new file mode 100644 index 0000000..0f7f6bc --- /dev/null +++ b/fengxiao/imgs/support/list1.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/support/list2.svg b/fengxiao/imgs/support/list2.svg new file mode 100644 index 0000000..39fa9d6 --- /dev/null +++ b/fengxiao/imgs/support/list2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/support/list3.svg b/fengxiao/imgs/support/list3.svg new file mode 100644 index 0000000..6c3072f --- /dev/null +++ b/fengxiao/imgs/support/list3.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/support/right.png b/fengxiao/imgs/support/right.png new file mode 100644 index 0000000..0c4c550 Binary files /dev/null and b/fengxiao/imgs/support/right.png differ diff --git a/fengxiao/imgs/website/bg.png b/fengxiao/imgs/website/bg.png new file mode 100644 index 0000000..f77662f Binary files /dev/null and b/fengxiao/imgs/website/bg.png differ diff --git a/fengxiao/imgs/website/list1.png b/fengxiao/imgs/website/list1.png new file mode 100644 index 0000000..534f82f Binary files /dev/null and b/fengxiao/imgs/website/list1.png differ diff --git a/fengxiao/imgs/website/list2.png b/fengxiao/imgs/website/list2.png new file mode 100644 index 0000000..e4310a7 Binary files /dev/null and b/fengxiao/imgs/website/list2.png differ diff --git a/fengxiao/imgs/website/list3.png b/fengxiao/imgs/website/list3.png new file mode 100644 index 0000000..57fa5c8 Binary files /dev/null and b/fengxiao/imgs/website/list3.png differ diff --git a/fengxiao/imgs/website/list4.png b/fengxiao/imgs/website/list4.png new file mode 100644 index 0000000..452e7d2 Binary files /dev/null and b/fengxiao/imgs/website/list4.png differ diff --git a/fengxiao/imgs/website/list5.png b/fengxiao/imgs/website/list5.png new file mode 100644 index 0000000..5a89473 Binary files /dev/null and b/fengxiao/imgs/website/list5.png differ diff --git a/fengxiao/imgs/website/process1.svg b/fengxiao/imgs/website/process1.svg new file mode 100644 index 0000000..10387d9 --- /dev/null +++ b/fengxiao/imgs/website/process1.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/website/process2.svg b/fengxiao/imgs/website/process2.svg new file mode 100644 index 0000000..3014730 --- /dev/null +++ b/fengxiao/imgs/website/process2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/website/process3.svg b/fengxiao/imgs/website/process3.svg new file mode 100644 index 0000000..c23e128 --- /dev/null +++ b/fengxiao/imgs/website/process3.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/website/process4.svg b/fengxiao/imgs/website/process4.svg new file mode 100644 index 0000000..14d0600 --- /dev/null +++ b/fengxiao/imgs/website/process4.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/website/process5.svg b/fengxiao/imgs/website/process5.svg new file mode 100644 index 0000000..6ce1bc2 --- /dev/null +++ b/fengxiao/imgs/website/process5.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/website/right.svg b/fengxiao/imgs/website/right.svg new file mode 100644 index 0000000..202c904 --- /dev/null +++ b/fengxiao/imgs/website/right.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/fengxiao/imgs/website/roll1.jpg b/fengxiao/imgs/website/roll1.jpg new file mode 100644 index 0000000..6b16650 Binary files /dev/null and b/fengxiao/imgs/website/roll1.jpg differ diff --git a/fengxiao/imgs/website/roll2.jpg b/fengxiao/imgs/website/roll2.jpg new file mode 100644 index 0000000..e2fff6f Binary files /dev/null and b/fengxiao/imgs/website/roll2.jpg differ diff --git a/fengxiao/imgs/website/roll3.jpg b/fengxiao/imgs/website/roll3.jpg new file mode 100644 index 0000000..832719d Binary files /dev/null and b/fengxiao/imgs/website/roll3.jpg differ diff --git a/fengxiao/imgs/website/roll4.jpg b/fengxiao/imgs/website/roll4.jpg new file mode 100644 index 0000000..ee4d7e7 Binary files /dev/null and b/fengxiao/imgs/website/roll4.jpg differ diff --git a/fengxiao/index.html b/fengxiao/index.html new file mode 100644 index 0000000..4e2e0d4 --- /dev/null +++ b/fengxiao/index.html @@ -0,0 +1,255 @@ + + + + + + + + + + + 深圳丰潇 + + + + + +
+ +
+ + +
+
+ + +
+ + + + +
+
+
+

网站设计新视界

+

我们以用户为中心，将环保、智能、情感价值融入设计，同时拥抱AI新技术，实现设计突破，提升用户体验，推动社会可持续发展。

+ 查看更多 +
+
+
+
+ 新视界1 + 新视界2 + 新视界3 +
+
+
+
+
+ + +
+
+
+
+
+ AI模型 +
+
+

AI模型训练

+

与接入技术服务

+

为企业构建、训练、部署定制化的 AI 模型，支持多种业务场景如智能客服、推荐系统、图像识别、文档处理等。实现 AI 能力的快速接入与业务融合。

+ 查看更多 +
+
+ + +
+
    +
  • +
    + 智能客服 +
    +
    +

    智能客服

    +

    智能技术赋能，真正懂客户的客服机器人提供全天候服务。

    +
    + +
    • +
  • +
    + 电商推荐系统 +
    +
    +

    电商推荐系统

    +

    为用户提供精准的商品推荐，提升购物体验和消费满意度。

    +
    + +
    • +
  • +
    + 图像识别 +
    +
    +

    图像识别

    +

    提供超过十万种物体和场景的通用图像识别，以及人脸、植物、车型、动物、logo等类别识别，还支持定制化识图和私有化部署。

    +
    + +
    • +
  • +
    + 文档处理 +
    +
    +

    文档处理

    +

    运用先进AI技术，提供全面的文档处理功能，如智能排版、多语言翻译、自动纠错等，让文档编辑、整理、翻译变得轻松简单。

    +
    + +
    • +
+ + + +
+
+
+ 分割装饰 +
+
+

我们的优势

+
    +
  • + 优势1 +

    支持大模型微调(如 GPT、BERT、CLIP)与私有化部署

    +
    • +
  • + 优势2 +

    接入企业专属知识库，提供 RAG 检索增强生成方案

    +
    • +
  • + 优势3 +

    内置安全策略与日志审计功能，保障模型可控与合规

    +
    • +
+ +
+ 7*24小时服务 + 专业技术服务 + 全周期解决方案 +
+
+ +
+ +
+ + +
+ + +
+

Copyright ©深圳丰潇技术服务有限公司    版权所有

+
+ +
+ + + + + \ No newline at end of file diff --git a/fengxiao/js/aimodel.js b/fengxiao/js/aimodel.js new file mode 100644 index 0000000..9ca52d3 --- /dev/null +++ b/fengxiao/js/aimodel.js @@ -0,0 +1,167 @@ +document.addEventListener('DOMContentLoaded', function () { + const track = document.querySelector('.carousel-track'); + const dotsContainer = document.querySelector('.carousel-dots'); + + // 轮播图数据 + const carouselData = [ + { + title: "客服大模型接入与知识库问答", + image: "../imgs/model/list1.jpg" + }, + { + title: "电商推荐系统/用户画像分析", + image: "../imgs/model/list2.jpg" + }, + { + title: "图像识别(商品识别、OCR、检测)", + image: "../imgs/model/list3.jpg" + }, + { + title: "NLP 应用(舆情分析、智能问答、文档结构化)", + image: "../imgs/model/list4.jpg" + }, + { + title: "多模态生成(AI绘画、广告创意)", + image: "../imgs/model/list5.jpg" + }, + + ]; + + // 创建轮播项目 + function createCarouselItems() { + // 克隆最后两个项目到开头 + for (let i = carouselData.length - 2; i < carouselData.length; i++) { + const item = createItem(carouselData[i]); + track.appendChild(item.cloneNode(true)); + } + + // 添加原始项目 + carouselData.forEach(data => { + track.appendChild(createItem(data)); + }); + + // 克隆前两个项目到末尾 + for (let i = 0; i < 2; i++) { + const item = createItem(carouselData[i]); + track.appendChild(item.cloneNode(true)); + } + } + + function createItem(data) { + const item = document.createElement('div'); + item.className = 'carousel-item'; + item.innerHTML = ` + ${data.title} +
${data.title}
+ `; + return item; + } + + // 初始化圆点 + function initDots() { + dotsContainer.innerHTML = ''; + carouselData.forEach((_, index) => { + const dot = document.createElement('div'); + dot.className = 'dot' + (index === 0 ? ' active' : ''); + dot.addEventListener('click', () => goToSlide(index)); + dotsContainer.appendChild(dot); + }); + } + + createCarouselItems(); + initDots(); + + const items = document.querySelectorAll('.carousel-item'); + const dots = document.querySelectorAll('.dot'); + const itemCount = carouselData.length; + let currentIndex = 2; // 从第一个真实项目开始 + let isAnimating = false; + let autoScrollInterval; + + + + function updateCarousel() { + const itemWidth = items[0].offsetWidth + 40; // 包括margin + + // 更新位置 + track.style.transform = `translateX(${-(currentIndex * itemWidth)}px)`; + + // 更新项目状态 + items.forEach((item, index) => { + item.classList.remove('left-side', 'center', 'right-side'); + + const relativePos = index - currentIndex; + if (relativePos === -1) { + item.classList.add('left-side'); + } else if (relativePos === 0) { + item.classList.add('center'); + } else if (relativePos === 1) { + item.classList.add('right-side'); + } + }); + + // 更新圆点 + const realIndex = (currentIndex - 2 + itemCount) % itemCount; + dots.forEach((dot, index) => { + dot.classList.toggle('active', index === realIndex); + }); + } + + function goToSlide(index) { + if (isAnimating) return; + isAnimating = true; + + currentIndex = index + 2; // 调整索引以匹配克隆项目 + + track.style.transition = 'transform 0.8s cubic-bezier(0.16, 0.77, 0.58, 0.97)'; + updateCarousel(); + + setTimeout(() => { + isAnimating = false; + }, 800); + + resetAutoScroll(); + } + + function nextSlide() { + if (isAnimating) return; + isAnimating = true; + + currentIndex++; + track.style.transition = 'transform 0.8s cubic-bezier(0.16, 0.77, 0.58, 0.97)'; + updateCarousel(); + + // 检查是否到达末尾克隆项目 + if (currentIndex > itemCount + 1) { + setTimeout(() => { + track.style.transition = 'none'; + currentIndex = 2; + updateCarousel(); + isAnimating = false; + }, 800); + } else { + setTimeout(() => { + isAnimating = false; + }, 800); + } + } + + function startAutoScroll() { + autoScrollInterval = setInterval(nextSlide, 3000); + } + + function resetAutoScroll() { + clearInterval(autoScrollInterval); + startAutoScroll(); + } + + // 初始化 + updateCarousel(); + startAutoScroll(); + + // 窗口大小变化时重新计算 + window.addEventListener('resize', () => { + track.style.transition = 'none'; + updateCarousel(); + }); +}); \ No newline at end of file diff --git a/fengxiao/js/header.js b/fengxiao/js/header.js new file mode 100644 index 0000000..4891b92 --- /dev/null +++ b/fengxiao/js/header.js @@ -0,0 +1,57 @@ +document.addEventListener('DOMContentLoaded', function () { + /** 主营业务下拉菜单与遮罩层交互 */ + const dropdown = document.querySelector('.nav-dropdown'); + const mask = document.querySelector('.dropdown-mask'); + const navLink = dropdown?.querySelector('.nav-link'); + + if (dropdown || mask || navLink) { + const handleToggleDropdown = (e) => { + e.preventDefault(); + const isOpen = dropdown.classList.contains('open'); + if (isOpen) { + dropdown.classList.remove('open'); + dropdown.setAttribute('aria-expanded', 'false'); + mask.classList.remove('active'); + } else { + dropdown.classList.add('open'); + dropdown.setAttribute('aria-expanded', 'true'); + mask.classList.add('active'); + } + }; + + const handleCloseDropdown = () => { + dropdown.classList.remove('open'); + dropdown.setAttribute('aria-expanded', 'false'); + mask.classList.remove('active'); + }; + + // 点击"主营业务"切换下拉 + navLink.addEventListener('click', handleToggleDropdown); + + // 遮罩层点击关闭 + mask.addEventListener('click', handleCloseDropdown); + + // 键盘无障碍支持（Enter/Space） + dropdown.addEventListener('keydown', (e) => { + if (e.key === 'Enter' || e.key === ' ') { + e.preventDefault(); + handleToggleDropdown(e); + } + if (e.key === 'Escape') { + handleCloseDropdown(); + } + }); + } + +}); + + +window.addEventListener('scroll', () => { + const header = document.querySelector('.header'); + if (!header) return; + if (window.scrollY > 10) { + header.classList.add('scrolled'); + } else { + header.classList.remove('scrolled'); + } + }); \ No newline at end of file diff --git a/fengxiao/js/index.js b/fengxiao/js/index.js new file mode 100644 index 0000000..5330b0d --- /dev/null +++ b/fengxiao/js/index.js @@ -0,0 +1,39 @@ +document.addEventListener('DOMContentLoaded', function () { + /** business图片滚动动画 */ + const galleryList = document.querySelector('.gallery-list'); + const galleryImgs = galleryList ? galleryList.querySelectorAll('img') : []; + if (galleryList && galleryImgs.length > 0) { + let currentIndex = 0; + const imgCount = galleryImgs.length; + const imgHeight = galleryImgs[0].offsetHeight + parseInt(getComputedStyle(galleryImgs[0]).marginBottom); + let isAnimating = false; + + // 克隆首图到末尾实现无缝滚动 + const clone = galleryImgs[0].cloneNode(true); + galleryList.appendChild(clone); + + function scrollNext() { + if (isAnimating) return; + isAnimating = true; + currentIndex++; + galleryList.style.transition = 'transform 0.8s cubic-bezier(.4,0,.2,1)'; + galleryList.style.transform = `translateY(-${imgHeight * currentIndex}px)`; + // 滚动到克隆图后，瞬间回到首图 + if (currentIndex === imgCount) { + setTimeout(() => { + galleryList.style.transition = 'none'; + galleryList.style.transform = 'translateY(0)'; + currentIndex = 0; + // 强制reflow + void galleryList.offsetWidth; + isAnimating = false; + }, 820); + } else { + setTimeout(() => { + isAnimating = false; + }, 820); + } + } + setInterval(scrollNext, 2500); + } +}); \ No newline at end of file diff --git a/fengxiao/js/websiteDesign.js b/fengxiao/js/websiteDesign.js new file mode 100644 index 0000000..0c5f66b --- /dev/null +++ b/fengxiao/js/websiteDesign.js @@ -0,0 +1,162 @@ +document.addEventListener('DOMContentLoaded', function() { + const track = document.querySelector('.carousel-track'); + const dotsContainer = document.querySelector('.carousel-dots'); + + // 轮播图数据 + const carouselData = [ + { + title: "企业官网 / 品牌官网", + image: "../imgs/website/roll1.jpg" + }, + { + title: "电商商城（B2B/B2C）", + image: "../imgs/website/roll2.jpg" + }, + { + title: "教育、政务、医疗等垂直行业平台", + image: "../imgs/website/roll3.jpg" + }, + { + title: "SaaS 管理后台/数据可视化平台", + image: "../imgs/website/roll4.jpg" + } + ]; + + // 创建轮播项目 + function createCarouselItems() { + // 克隆最后两个项目到开头 + for (let i = carouselData.length - 2; i < carouselData.length; i++) { + const item = createItem(carouselData[i]); + track.appendChild(item.cloneNode(true)); + } + + // 添加原始项目 + carouselData.forEach(data => { + track.appendChild(createItem(data)); + }); + + // 克隆前两个项目到末尾 + for (let i = 0; i < 2; i++) { + const item = createItem(carouselData[i]); + track.appendChild(item.cloneNode(true)); + } + } + + function createItem(data) { + const item = document.createElement('div'); + item.className = 'carousel-item'; + item.innerHTML = ` + ${data.title} +
${data.title}
+ `; + return item; + } + + // 初始化圆点 + function initDots() { + dotsContainer.innerHTML = ''; + carouselData.forEach((_, index) => { + const dot = document.createElement('div'); + dot.className = 'dot' + (index === 0 ? ' active' : ''); + dot.addEventListener('click', () => goToSlide(index)); + dotsContainer.appendChild(dot); + }); + } + + createCarouselItems(); + initDots(); + + const items = document.querySelectorAll('.carousel-item'); + const dots = document.querySelectorAll('.dot'); + const itemCount = carouselData.length; + let currentIndex = 2; // 从第一个真实项目开始 + let isAnimating = false; + let autoScrollInterval; + + + + function updateCarousel() { + const itemWidth = items[0].offsetWidth + 40; // 包括margin + + // 更新位置 + track.style.transform = `translateX(${-(currentIndex * itemWidth)}px)`; + + // 更新项目状态 + items.forEach((item, index) => { + item.classList.remove('left-side', 'center', 'right-side'); + + const relativePos = index - currentIndex; + if (relativePos === -1) { + item.classList.add('left-side'); + } else if (relativePos === 0) { + item.classList.add('center'); + } else if (relativePos === 1) { + item.classList.add('right-side'); + } + }); + + // 更新圆点 + const realIndex = (currentIndex - 2 + itemCount) % itemCount; + dots.forEach((dot, index) => { + dot.classList.toggle('active', index === realIndex); + }); + } + + function goToSlide(index) { + if (isAnimating) return; + isAnimating = true; + + currentIndex = index + 2; // 调整索引以匹配克隆项目 + + track.style.transition = 'transform 0.8s cubic-bezier(0.16, 0.77, 0.58, 0.97)'; + updateCarousel(); + + setTimeout(() => { + isAnimating = false; + }, 800); + + resetAutoScroll(); + } + + function nextSlide() { + if (isAnimating) return; + isAnimating = true; + + currentIndex++; + track.style.transition = 'transform 0.8s cubic-bezier(0.16, 0.77, 0.58, 0.97)'; + updateCarousel(); + + // 检查是否到达末尾克隆项目 + if (currentIndex > itemCount + 1) { + setTimeout(() => { + track.style.transition = 'none'; + currentIndex = 2; + updateCarousel(); + isAnimating = false; + }, 800); + } else { + setTimeout(() => { + isAnimating = false; + }, 800); + } + } + + function startAutoScroll() { + autoScrollInterval = setInterval(nextSlide, 3000); + } + + function resetAutoScroll() { + clearInterval(autoScrollInterval); + startAutoScroll(); + } + + // 初始化 + updateCarousel(); + startAutoScroll(); + + // 窗口大小变化时重新计算 + window.addEventListener('resize', () => { + track.style.transition = 'none'; + updateCarousel(); + }); +}); \ No newline at end of file diff --git a/驭鑫/new yxsilicon/html/serviceCases.html b/驭鑫/new yxsilicon/html/serviceCases.html index 386ff9c..46c3122 100644 --- a/驭鑫/new yxsilicon/html/serviceCases.html +++ b/驭鑫/new yxsilicon/html/serviceCases.html @@ -89,6 +89,14 @@
+ - +
diff --git a/驭鑫/new yxsilicon/js/serviceCases.js b/驭鑫/new yxsilicon/js/serviceCases.js index f16b63c..0a6e672 100644 --- a/驭鑫/new yxsilicon/js/serviceCases.js +++ b/驭鑫/new yxsilicon/js/serviceCases.js @@ -1,10 +1,11 @@ // 假设放在