|
@@ -13,43 +13,45 @@
|
|
|
|
|
|
body {
|
|
|
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
|
- background: #025E8E;
|
|
|
+ background: url('/images/ai-background.png') no-repeat center center;
|
|
|
margin: 0;
|
|
|
line-height: 1.6;
|
|
|
position: relative; /* 为绝对定位子元素提供参照 */
|
|
|
- z-index: 1000;
|
|
|
+ /*z-index: 1000;*/
|
|
|
height: 610px;
|
|
|
}
|
|
|
|
|
|
/* 容器样式 */
|
|
|
.container {
|
|
|
/*max-width: 600px;*/
|
|
|
- margin: -20% auto;
|
|
|
+ /*margin: -20% auto;*/
|
|
|
background: #F5F5F5;
|
|
|
border-radius: 15px;
|
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
|
/* overflow: hidden;*/
|
|
|
- position: relative;
|
|
|
- top: 10%;
|
|
|
+ position: absolute;
|
|
|
+ top: 15%;
|
|
|
width: 100%;
|
|
|
- height: 96%;
|
|
|
+ height: 50%;
|
|
|
+ margin-top: 85%;
|
|
|
}
|
|
|
|
|
|
/* 页头区域 */
|
|
|
.header {
|
|
|
position: absolute;
|
|
|
- width: 350px;
|
|
|
- height: 95px;
|
|
|
- top: 80px;
|
|
|
- left: 16px;
|
|
|
+ /* width: 350px; */
|
|
|
+ /* height: 95px; */
|
|
|
+ /* top: 80px; */
|
|
|
+ /* left: 16px; */
|
|
|
border-radius: 13px 13px 4px 4px;
|
|
|
background: linear-gradient(135deg, #5689AF, #025E8E);
|
|
|
- padding: 1.2rem;
|
|
|
- z-index: -10;
|
|
|
- box-sizing: border-box;
|
|
|
- margin-top: -160px;
|
|
|
+ /* padding: 1.2rem; */
|
|
|
+ /* z-index: -10; */
|
|
|
+ /* box-sizing: border-box; */
|
|
|
+ /* margin-top: -160px; */
|
|
|
}
|
|
|
|
|
|
+
|
|
|
/* 渐变边框实现 */
|
|
|
.header::before {
|
|
|
content: '';
|
|
@@ -207,10 +209,9 @@
|
|
|
/* 支付方式 */
|
|
|
.payment-section {
|
|
|
padding: 0.6rem;
|
|
|
- /*display: inline-block;
|
|
|
- margin-top: -9%;*/
|
|
|
position: absolute;
|
|
|
height: -webkit-fill-available;
|
|
|
+ margin-top: 3%;
|
|
|
}
|
|
|
|
|
|
.payment-section-pay {
|
|
@@ -600,13 +601,13 @@
|
|
|
<div class="container" th:fragment="main">
|
|
|
<!-- 页头动态数据绑定 -->
|
|
|
<header class="header">
|
|
|
- <div class="branding">
|
|
|
+ <!--<div class="branding">
|
|
|
<div class="header-text">
|
|
|
<h1 th:text="${serviceInfo.title}"></h1>
|
|
|
<p th:text="${serviceInfo.subtitle}"></p>
|
|
|
</div>
|
|
|
<img th:src="@{/images/助手机器人.png}" alt="AI助手" class="robot-logo">
|
|
|
- </div>
|
|
|
+ </div>-->
|
|
|
</header>
|
|
|
|
|
|
<!--<div class="middle">
|
|
@@ -631,7 +632,7 @@
|
|
|
</section>-->
|
|
|
|
|
|
<!-- 功能对比表动态生成 -->
|
|
|
- <section class="feature-grid_out">
|
|
|
+ <!--<section class="feature-grid_out">
|
|
|
<th:block th:each="col : ${featureList}">
|
|
|
<div class="feature-grid">
|
|
|
<div class="grid-item col-header" th:classappend="${col.getIsHighlight()} ? 'isHighlight' : ''"
|
|
@@ -642,7 +643,7 @@
|
|
|
th:text="${detail.value}"></div>
|
|
|
</div>
|
|
|
</th:block>
|
|
|
- </section>
|
|
|
+ </section>-->
|
|
|
|
|
|
<!--支付方式-->
|
|
|
<section class="payment-section">
|