雾里微凉此生情想看多少节？

雾里微凉此生情想看多少节？

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />

<title></title>

<link rel="stylesheet" href="css/bootstrap.min.css" />

<style>

/* Make the image fully responsive */

.carousel-inner img {

width: 100%;

height: 100%;

}

</style>

</head>

<body>

<!-- 导航栏 开始-->

<nav class="navbar navbar-expand-sm bg-dark navbar-dark">

<!-- Brand/logo -->

<a class="navbar-brand" href="#">

<img src="img/logo.png" alt="logo">

</a>

<!-- 折叠按钮-->

<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">

<span class="navbar-toggler-icon"></span>

</button>

<!-- 折叠项-->

<div class="collapse navbar-collapse" id="collapsibleNavbar">

<!-- Links -->

<ul class="navbar-nav">

<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">

<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>

</ul>

</div>

<div class="navbar-right">

<ul class="navbar-nav">

<li class="nav-item">

<a class="nav-link" href="#">注册</a>

</li>

<li class="nav-item">

<a class="nav-link" href="#myModal" data-toggle="modal">登录</a>

</li>

</ul>

</div>

<div class="navbar-right" style="width: 300px;">

<div class="input-group">

<input type="text" class="form-control" placeholder="请输入要搜索的内容">

<div class="input-group-append">

<button class="btn btn-success">搜索</button>

</div>

</div>

</div>

</nav>

<!-- 导航栏 结束-->

<!-- 图片轮播 开始-->

<div id="demo" class="carousel slide" data-ride="carousel">

<!-- 指示符 -->

<ul class="carousel-indicators">

<li data-target="#demo" data-slide-to="0" class="active"></li>

<li data-target="#demo" data-slide-to="1"></li>

<li data-target="#demo" data-slide-to="2"></li>

</ul>

<!-- 轮播图片 -->

<div class="carousel-inner">

<div class="carousel-item active">

<img src="img/img1.jpg">

</div>

<div class="carousel-item">

<img src="img/img2.jpg">

</div>

<div class="carousel-item">

<img src="img/img3.jpg">

</div>

</div>

<!-- 左右切换按钮 -->

<a class="carousel-control-prev " href="#demo" data-slide="prev">

<span class="carousel-control-prev-icon"></span>

</a>

<a class="carousel-control-next " href="#demo" data-slide="next">

<span class="carousel-control-next-icon"></span>

</a>

</div>

<!-- 图片轮播结束-->

<!-- 登录模态框 -->

<div class="modal fade" id="myModal">

<div class="modal-dialog">

<div class="modal-content">

<!-- 模态框头部 -->

<div class="modal-header">

<h4 class="modal-title">

欢迎登录

<small>SIGN IN</small>

</h4>

<button class="close" data-dismiss="modal">&times;</button>

</div>

<!-- 模态框主体 -->

<div class="modal-body">

<form action="#">

<div class="col-md-12 m-2">

<input class="form-control" type="text" placeholder="手机/邮箱/用户名" />

</div>

<div class="col-md-12 m-2">

<input class="form-control" type="password" placeholder="密码" />

</div>

<div class="col-md-12 m-2">

<input type="checkbox" />下次自动登录

</div>

<div class="col-md-12 mb-2">

<input class="btn btn-danger form-control" type="submit" value="登录" />

</div>

</form>

</div>

<!-- 模态框底部 -->

<div class="modal-footer">

<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>

</div>

</div>

</div>

</div>

<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>

<script type="text/javascript" src="js/bootstrap.min.js"></script>

</body>

</html>