<head th:fragment="header">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title></title>
<link href="/css/bootstrap.min.css" rel="stylesheet">
<link href="/css/blog/clean-blog.css" rel="stylesheet">
<link href="/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<style type="text/css">
	@media (max-width:768px){
		.side{ display:none;  }
		}
	@media (min-width:768px){
		.side{ display:block;  }
		}
	.side{
		position: fixed;
	    width: 50px;
	    right: 5%;
	    bottom: 15%;
	    z-index: 100;
	}
	.side ul{
		list-style:none;
	}
	.side ul li {
	    width: 35px;
	    height: 35px;
	    float: left;
	    position: relative;
	    margin-top: 9px;
	}
	.side ul li .qqbdimg {
	    padding: 7px;
	    margin-top: 5px;
	    margin-bottom: 1px;
	    /* margin-left: 22px; */
	    position: absolute;
	    width: 53px;
	    height: 54px;
	    /* margin-left: 9px; */
	    bottom: 0;
	    right: -7px;
	    transition: all 0.3s;
	    background: #fff;
	    opacity: 0;
	    filter: Alpha(opacity=80);
	    color: #fff;
	    font: 14px/54px "微软雅黑";
	    overflow: hidden;
	}
	.side ul li .qqbdimg:hover{
		overflow:hidden;
		padding: 7px;
	    margin-top: 5px;
	    width:124px;
	    height:124px;
	    opacity:1;
	    z-index:100;
	    right:0;
	    background:rgb(142, 142, 142);
	}
	.side ul li img {
	    width: 100%;
	    height: 100%;
	}
	.side ul li .sidetop {
	    height: 100%;
	    display: block;
	    background: #2f4050;
	    padding: 2px 0px;
	    text-align: center;
	    color: #fff;
	    border-radius: 50%;
	    opacity: .5;
	}
</style>
</head>
<nav th:fragment="nav">
<!--	<div class="container">-->
<!--		<div class="navbar-header page-scroll">-->
<!--			<button type="button" class="navbar-toggle" data-toggle="collapse"-->
<!--				data-target="#bs-example-navbar-collapse-1">-->
<!--				<span class="sr-only">Toggle navigation</span> <span-->
<!--					class="icon-bar"></span> <span class="icon-bar"></span> <span-->
<!--					class="icon-bar"></span>-->
<!--			</button>-->
<!--			<a class="navbar-brand" href="/" style="font-size: 24px;">BootDo</a>-->
<!--		</div>-->
<!--		<div class="collapse navbar-collapse"-->
<!--			id="bs-example-navbar-collapse-1">-->
<!--			<ul class="nav navbar-nav navbar-right">-->
<!--				<li><a href="/">主页</a></li>-->
<!--				<li><a href="/blog/open/page/about">关于</a></li>-->
<!--				<li><a href="/blog/open/page/communication">交流</a></li>-->
<!--				<li><a href="/login">登录</a></li>-->
<!--			</ul>-->
<!--		</div>-->
<!--	</div>-->
</nav>
<div th:fragment="footer">
	<footer>
<!--		<div class="container">-->
<!--			<div class="row">-->
<!--				<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">-->
<!--					<ul class="list-inline text-center">-->
<!--						<li><a href="https://jq.qq.com/?_wv=1027&k=5ICuFaQ"> <span-->
<!--								class="fa-stack fa-lg"> <i-->
<!--									class="fa fa-circle fa-stack-2x"></i> <i-->
<!--									class="fa fa-qq fa-stack-1x fa-inverse"></i>-->
<!--							</span>-->
<!--						</a></li>-->
<!--						<li><a href="https://www.oschina.net/p/bootdo"> <span-->
<!--								class="fa-stack fa-lg"> <i-->
<!--									class="fa fa-circle fa-stack-2x"></i> <i-->
<!--									class="fa fa-home fa-stack-1x fa-inverse"></i>-->
<!--							</span>-->
<!--						</a></li>-->
<!--						<li><a href="https://github.com/lcg0124/bootdo.git"> <span-->
<!--								class="fa-stack fa-lg"> <i-->
<!--									class="fa fa-circle fa-stack-2x"></i> <i-->
<!--									class="fa fa-github fa-stack-1x fa-inverse"></i>-->
<!--							</span>-->
<!--						</a></li>-->
<!--					</ul>-->
<!--					<p class="copyright text-muted">Copyright &copy; bootdo.com-->
<!--						2017</p>-->
<!--					<p class="copyright text-muted">鲁ICP备17042918号</p>-->

<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
	</footer>
	<div class="side" >
		<ul>
<!--			<li>-->
<!--				<div class="qqbdimg">-->
<!--					<img src="/img/blog/qqbootdo.png" title="学习交流"/>-->
<!--				</div>-->
<!--				<a class="sidetop" id="qqbd" href="javascript:scroll(0,0)" title="学习交流"><i-->
<!--					class="fa fa-qq"></i></a>-->
<!--			</li>-->
			<li>
				<a class="sidetop" href="javascript:scroll(0,0)" title="返回顶部"><i
					class="fa fa-arrow-up"></i></a>
					
			</li>
		</ul>
	</div>
	<script src="/js/jquery.min.js"></script>
	<script src="/js/bootstrap.min.js"></script>
	<script src="/js/plugins/layer/layer.js"></script>
	<script src="/js/ajax-util.js"></script>
	<script src="/js/appjs/blog/clean-blog.min.js"></script>
	<script src="/js/plugins/summernote/summernote.min.js"></script>
	<script src="/js/plugins/summernote/summernote-zh-CN.js"></script>
</div>

