新浪云-swiper 响应式页面

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>新浪云官网</title><link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet"><link rel="stylesheet" href="./css/swiper.min.css"><style>html {font-size: 14px;}.bor div {border: 1px solid red;min-height: 100px;}.col-lg-3 img {min-height: 100px;}ul {margin: 0;padding: 0;}.font12 {font-size: 12px;}.font18 {font-size: 18px;}.font20 {font-size: 20px;}.font22 {font-size: 22px;}.font24 {font-size: 24px;}.btn-purple {color: #fff;background-color: purple;border-color: purple;}.btn-purple:hover {color: #fff;background-color: rgb(105, 11, 105);border-color: rgb(109, 9, 109);}.footer dd {margin-bottom: 0;}</style>
</head><body><nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #148CCA;"><div class="container"><a class="navbar-brand" href="#"><img src="./images/logo.png" alt="" width="95"></a><button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button><div class="collapse navbar-collapse" id="navbarSupportedContent"><ul class="navbar-nav mr-auto"><li class="nav-item active"><a class="nav-link" href="#">首页 <span class="sr-only">(current)</span></a></li><li class="nav-item"><a class="nav-link" href="#">产品</a></li><li class="nav-item"><a class="nav-link" href="#">支持中心</a></li><li class="nav-item"><a class="nav-link" href="#">价格</a></li><li class="nav-item dropdown"><a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">社区</a><div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item" href="#">成功案例</a><a class="dropdown-item" href="#">微博地址</a></div></li></ul><ul class="nav justify-content-center"><li class="nav-item"><a class="nav-link active text-white" href="#">微博登录</a></li><li class="nav-item"><a class="nav-link text-white" href="#">|</a></li><li class="nav-item"><a class="nav-link text-white" href="#">微博注册</a></li></ul></div></div></nav><div class="swiper-container"><div class="swiper-wrapper"><div class="swiper-slide"><img src="./images/1.jpg" alt="" class="img-fluid"></div><div class="swiper-slide"><img src="./images/2.jpg" alt="" class="img-fluid"></div></div><!-- 如果需要分页器 --><div class="swiper-pagination"></div><!-- 如果需要导航按钮 --><div class="swiper-button-prev"></div><div class="swiper-button-next"></div></div><div class="container mt-5"><div class="row"><div class="col-lg-3 text-center"><img src="./images/cont1.png" alt="" class="img-fluid"><h3 class="mt-2 text-primary">SAE</h3><p>云应用</p></div><div class="col-lg-9"><h2 class="font24">应用开发、优化及运行的PaaS云计算平台</h2><p>国内第一家公有云计算平台，支持PHP、Java、Python语言，提供Web应用开发所需的众多服务，国内最好的PaaS云计算平台</p><div class="row ml-3"><ul class="col-md-6"><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li></ul><ul class="col-md-6"><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li></ul></div><a href="http://aixue8.com" class="btn btn-purple btn-sm mt-3">查看详情</a></div></div><div class="row my-5"><div class="col-lg-3 text-center order-lg-12"><img src="./images/cont2.png" alt="" class="img-fluid"><h3 class="mt-2 text-primary">SAE</h3><p>云应用</p></div><div class="col-lg-9 order-lg-1"><h2 class="font24">应用开发、优化及运行的PaaS云计算平台</h2><p>国内第一家公有云计算平台，支持PHP、Java、Python语言，提供Web应用开发所需的众多服务，国内最好的PaaS云计算平台</p><div class="row ml-3"><ul class="col-md-6"><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li></ul><ul class="col-md-6"><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li></ul></div><a href="http://aixue8.com" class="btn btn-info btn-sm mt-3">查看详情</a></div></div><div class="row"><div class="col-lg-3 text-center"><img src="./images/cont3.png" alt="" class="img-fluid"><h3 class="mt-2 text-primary">SAE</h3><p>云应用</p></div><div class="col-lg-9"><h2 class="font24">应用开发、优化及运行的PaaS云计算平台</h2><p>国内第一家公有云计算平台，支持PHP、Java、Python语言，提供Web应用开发所需的众多服务，国内最好的PaaS云计算平台</p><div class="row ml-3"><ul class="col-md-6"><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li></ul><ul class="col-md-6"><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li><li>弹性扩展，负载均衡智能应对大数据处理请求</li></ul></div><a href="http://aixue8.com" class="btn btn-primary btn-sm mt-3">查看详情</a></div></div></div><div class="container mt-5"><img src="./images/video.png" class="img-fluid rounded" alt=""></div><div class="container mt-5"><h3>产品特色</h3><hr><div class="row mt-4"><div class="col-lg-3 text-center col-md-6"><img src="./images/icon1.png" alt="" class="img-fluid"><h3 class="font20 mt-2">安全可靠</h3><p>多层防护，多级备份，24小时全方位监控，放心托管您的应用与网站。</p></div><div class="col-lg-3 text-center col-md-6"><img src="./images/icon2.png" alt="" class="img-fluid"><h3 class="font20 mt-2">安全可靠</h3><p>多层防护，多级备份，24小时全方位监控，放心托管您的应用与网站。</p></div><div class="col-lg-3 text-center col-md-6"><img src="./images/icon3.png" alt="" class="img-fluid"><h3 class="font20 mt-2">安全可靠</h3><p>多层防护，多级备份，24小时全方位监控，放心托管您的应用与网站。</p></div><div class="col-lg-3 text-center col-md-6"><img src="./images/icon4.png" alt="" class="img-fluid"><h3 class="font20 mt-2">安全可靠</h3><p>多层防护，多级备份，24小时全方位监控，放心托管您的应用与网站。</p></div></div></div><div class="jumbotron jumbotron-fluid mt-4"><div class="container text-center"><h1 class="font24">零基础也可立即轻松上云无门槛</h1><p class="lead">不写一行代码，两分钟一键生成属于你的高质量网站</p><a class="btn btn-primary btn-lg" href="#" role="button">立即使用</a></div></div><div class="container"><h3>产品特色</h3><hr><div class="row"><div class="col-lg-6"><img src="./images/typical.jpg" alt="" class="img-fluid"></div><div class="col-lg-6 align-self-center"><p>SAE作为公有云服务，其整体架构具有高可靠性和高安全性，并具备专业的团队来负责安全及运营维护工作 ，因而极大地简化了项目组部署和维护工作，使得项目组能集中精力于核心业务的开发，为用户提供更好的体验。</p></div></div></div><hr><div class="container"><div class="row"><div class="col-lg-2 col-6 footer"><dl><dt class="mb-2">产品</dt><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd></dl></div><div class="col-lg-2 col-6 footer"><dl><dt class="mb-2">产品</dt><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd></dl></div><div class="col-lg-2 col-6 footer"><dl><dt class="mb-2">产品</dt><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd></dl></div><div class="col-lg-2 col-6 footer"><dl><dt class="mb-2">产品</dt><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd></dl></div><div class="col-lg-2 col-6 footer"><dl><dt class="mb-2">关于新浪云</dt><dd><a href="#" class="font12">掌上SAE客户端</a></dd><dd><a href="#" class="font12"><img src="./images/sao.png" alt="" class="img-fluid"></a></dd></dl></div><div class="col-lg-2 col-6 footer"><dl><dt class="mb-2">可信云认证</dt><dd><a href="#" class="font12"><img src="./images/kexinyun.png" alt="" class="img-fluid"></a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd><dd><a href="#" class="font12">云应用 SAE</a></dd></dl></div></div></div><hr><p class="text-center pt-2 pb-3">Copyright © 1996-2015 SINA Corporation All Rights Reserved. 京ICP证000007-104</p><script src='https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js'></script><script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.2.1/js/bootstrap.bundle.min.js"></script><script src="./js/swiper.min.js"></script><script>var mySwiper = new Swiper('.swiper-container', {direction: 'horizontal', // 垂直切换选项loop: true, // 循环模式选项// 如果需要分页器pagination: {el: '.swiper-pagination',},// 如果需要前进后退按钮navigation: {nextEl: '.swiper-button-next',prevEl: '.swiper-button-prev',},// 如果需要滚动条scrollbar: {el: '.swiper-scrollbar',},})        </script>
</body></html>

新浪云-swiper 响应式页面相关推荐

【公众号】微信第三方登录（静默授权和非静默授权）（具体代码：U盘新浪云SAE）...
一.微信联合登录是怎么登录的,有几种登录方式:微信联合登录和微信授权登录[授权登录(非静默授权)与静默授权] [主动授权]:需要用户确认登录,这样可以通过用户的个人确认,获取用户全面的信息,无论是否关 ...
Php静默授权,【公众号】微信第三方登录（静默授权和非静默授权）（具体代码：U盘新浪云SAE）...
一.微信联合登录是怎么登录的,有几种登录方式:微信联合登录和微信授权登录[授权登录(非静默授权)与静默授权] [主动授权]:需要用户确认登录,这样可以通过用户的个人确认,获取用户全面的信息,无论是否关 ...
新浪云python示例_在新浪云上部署Django应用程序
前言近日,笔者利用空闲时间写了一个简单的在线预约系统,使用的工具包括Python 3.5.1 和 Django 1.9.5 .早就有听说Django响亮的口号,"The web frame ...
sinaapp mysql连接_手把手教你在新浪云上免费部署自己的网站--连接数据库
看完之后,默认你知道怎么将代码上传到新浪云SAE,并且能够成功运行,连接数据库之前,你必须先创建有一个应用. 现在我创建一个名称为sampleone的应用,如下图点击左侧的代码管理,选在右侧创建一个 ...
通过新浪云部署NideShop微信小程序商城（基于Node.js+MySQL+ThinkJS）
本文档为微信小程序商城NideShop项目的安装部署教程(GitHub),欢迎star 一.购买新浪云SAE 为什么选择SAE? 免费二级域名和支持https访问,不用备案,可用于做微信小程序服务器. ...
新浪云python示例_新浪SAE部署python项目
SAE实际上就是个多节点的虚拟主机,跟云主机差不多,只不过SAE的节点比一般的云主机要多,把网站程序布署在SAE上比自己用独立的服务器稳定性和性能要高很多.将自己用python开发的博客项目放在SAE ...
#项目的编译和发布 #静态发布新浪云 #node服务器发布新浪云 #nodejs服务器部署数据库 #新浪云前后端结合
一. vue项目的编译和发布脚手架中有大量的新技术:vue文件,es6模块.. 这些文件语法大部分浏览器无法直接运行解决:开发好的项目,经过编译,打包,压缩,变成ES5代码部署到服务器如何:np ...
新浪服务器mysql_php新浪云链接mysql与storage
1.首先要有一个新浪云服务器 2.链接数据库获取数据 mysql CREATE TABLE Persons(FirstName varchar(255),LastName varchar(255)); ...
基于新浪云的微信公众号开发配置过程
使用新浪云(SAE)作为微信公众号服务器首先需要有一个新浪微博账号,没有的话, 请先注册一个,然后开始下面的步骤: 1 点击下面的地址,使用新浪微博账号登录,申请新浪云服务器资源. ...

新浪云-swiper 响应式页面

新浪云-swiper 响应式页面相关推荐

最新文章

热门文章