-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
213 lines (194 loc) · 9.61 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>新能源网</title>
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport">
<meta name="keywords" content="新能源网">
<meta name="description" content="新能源网">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="static/css/bootstrap.min.css">
<link rel="stylesheet" href="static/css/swiper-bundle.min.css">
<!-- 自己的样式 -->
<link rel="stylesheet/less" href="static/css/all.less">
<link rel="stylesheet/less" href="static/css/index.less">
<script src="static/js/jquery.min.js"></script>
<script src="static/js/bootstrap.min.js"></script>
<script src="static/js/swiper-bundle.min.js"></script>
<script src="static/js/less.min.js"></script>
</head>
<body>
<!-- 头部内容 -->
<header id="header">
<nav class="header-main navbar navbar-expand-lg navbar-light">
<a class="navbar-brand icon" href="#">
<img src="static/image/en-4.jpg" width="40px">
<span>新能源网</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navContent">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="">能源首页</a>
</li>
<li class="nav-item">
<a class="nav-link" href="member.html">能源简介</a>
</li>
<li class="nav-item">
<a class="nav-link" href="entrepren.html">能源创业者</a>
</li>
<li class="nav-item">
<a class="nav-link" href="supplier.html">能源供应商</a>
</li>
<li class="nav-item">
<a class="nav-link" href="compdyn.html">公司动态</a>
</li>
</ul>
</div>
</nav>
</header>
<!-- 主要内容 -->
<div class="imgs">
<div class="word">
<h2>Welcome To Our Studio!</h2>
<h2>很高兴见到你</h2>
<a href="#about" class="btn">Tell Me More</a>
</div>
</div>
<!-- 新能源公司 -->
<div id="about" class="container section">
<div class="row">
<div class="col-xxl-6 col-lg-6 col-md-12 left">
<p class="title">新能源公司</p>
<p class="desc">
新能源公司是以经济为设计理念的专注推广太阳能平台<br /><br />
本公司是一家专注推广太阳能光伏发电和储能系统的创新型企业,
业务范围涵盖:太阳能光伏及储能系统工程,设计咨询服务,
供货安装服务,运维服务。产品涉及太阳能光伏组件、逆变 器、控制器、储能电池、新能源汽车充....等.公司业务遍 及全国各地。
</p>
</div>
<div class="col-xxl-6 col-lg-6 col-md-12 right">
<img src="static/image/en-4.jpg" alt="" srcset="">
</div>
</div>
</div>
<!-- 为你服务 -->
<div class="container article">
<div class="title">为你服务</div>
<div class="row">
<div class="col-xxl-4 col-xl-4 col-lg-4 col-md-12 item">
<div class="item-img">
<img src="static/image/bank.jpg">
</div>
<div class="item-desc">
<h3 class="desc-h3">能源简介</h3>
<p class="desc-p">本公司是一家专注推广太阳能光伏发电和储能系统的创新型企业,太阳能光伏及储能系统工程,设计咨询服务。</p>
<div class="desc-btn"><a href="member.html" class="btn1">查看详情</a></div>
</div>
</div>
<div class="col-xxl-4 col-xl-4 col-lg-4 col-md-12 item">
<div class="item-img">
<img src="static/image/bank.jpg">
</div>
<div class="item-desc">
<h3 class="desc-h3">新能创业者</h3>
<p class="desc-p">本公司是一家专注推广太阳能光伏发电和储能系统的创新型企业,太阳能光伏及储能系统工程,设计咨询服务。</p>
<div class="desc-btn"><a href="entrepren.html" class="btn1">查看详情</a></div>
</div>
</div>
<div class="col-xxl-4 col-xl-4 col-lg-4 col-md-12 item">
<div class="item-img">
<img src="static/image/bank.jpg">
</div>
<div class="item-desc">
<h3 class="desc-h3">能源供应商</h3>
<p class="desc-p">本公司是一家专注推广太阳能光伏发电和储能系统的创新型企业,太阳能光伏及储能系统工程,设计咨询服务。</p>
<div class="desc-btn"><a href="supplier.html" class="btn1">查看详情</a></div>
</div>
</div>
</div>
</div>
<!-- 五大部门 -->
<div class="aside">
<div class="content">
<p class="title">五大部门多位一体</p>
<p class="desc">新能源从技术到服务全面把控,为平台客户带来全方位升级体验,解决平台客户的售前售后多重忧虑。</p>
</div>
<div class="container aside-main">
<div class="row">
<div class="swiper list">
<div class="swiper-wrapper">
<div class="swiper-slide item">
<img src="static/image/slide1.png">
<h4>新能源</h4>
<p>新能源平台的核心基础设施,为供应商、小店创业者、消费者提供多种技术支持与协同工具,便捷平台操作系统。 </p>
</div>
<div class="swiper-slide item">
<img src="static/image/slide2.png">
<h4>简介</h4>
<p>新能源平台的核心基础设施,为供应商、小店创业者、消费者提供多种技术支持与协同工具,便捷平台操作系统。 </p>
</div>
<div class="swiper-slide item">
<img src="static/image/slide3.png">
<h4>创造者</h4>
<p>新能源平台的核心基础设施,为供应商、小店创业者、消费者提供多种技术支持与协同工具,便捷平台操作系统。 </p>
</div>
<div class="swiper-slide item">
<img src="static/image/slide4.png">
<h4>供应商</h4>
<p>新能源平台的核心基础设施,为供应商、小店创业者、消费者提供多种技术支持与协同工具,便捷平台操作系统。 </p>
</div>
<div class="swiper-slide item">
<img src="static/image/slide2.png">
<h4>动态</h4>
<p>新能源平台的核心基础设施,为供应商、小店创业者、消费者提供多种技术支持与协同工具,便捷平台操作系统。 </p>
</div>
</div>
</div>
<div id="left" class="btn left"><img src="static/image/icon_left.png"></div>
<div id="right" class="btn right"><img src="static/image/icon_right.png"></div>
</div>
</div>
</div>
<!-- 底部 -->
<footer class="footer">
<div class="container footer-main">
<div class="left">
<div class="left-main">
<a href="#" target="_back">公司网站</a>
<a href="#" target="_blank">加入能源</a>
<a href="#">服务协议</a>
<a href="#">隐私协议</a>
</div>
<p class="address">公司名称:新能源科技有限公司</p>
<p class="address">公司电话:000-000-0000</p>
<p class="address">公司地址:中国广州市新能源科技有限公司</p>
<p class="address">新能源科技经营许可证:粤B2-20221319 <a href="#" class="ban" target="_blank">粤ICP备20221020-5号</a>
</p>
<p><span class="beiantu">更多模板:<a href="http://www.cssmoban.com/" target="_blank">模板之家</a></span></p>
</div>
<div class="right">
<p class="wx">官方微信</p>
<img src="static/image/en-4.jpg" alt="微信二维码">
</div>
</div>
</footer>
</body>
</html>
<script>
var swiper = new Swiper('.swiper', {
slidesPerView: 3,
spaceBetween: 35,
// loop: true, // 循环模式选项
// centeredSlides: true,
});
$('#left').click(function () {
swiper.slidePrev();
})
$('#right').click(function () {
swiper.slideNext();
})
</script>