272 lines
11 KiB
HTML
272 lines
11 KiB
HTML
<!DOCTYPE html>
|
||
<!-- 网站主语言 -->
|
||
<html lang="zh-cn">
|
||
<head>
|
||
<!-- 网站采用的字符编码 -->
|
||
<meta charset="utf-8">
|
||
<!-- 网站标题 -->
|
||
<title>首页</title>
|
||
<!-- 引入bootstrap的css文件 -->
|
||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
|
||
<!-- 引入monikai.css -->
|
||
<link rel="stylesheet" href="md_css/monokai.css">
|
||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
|
||
<!--导入css-->
|
||
<link rel="stylesheet" href="common/common.css">
|
||
<link rel="stylesheet" href="common/jquery.pagination.css">
|
||
<!-- 引入vuejs -->
|
||
<script type="text/javascript" src="js/vue-2.5.16.js"></script>
|
||
<script type="text/javascript" src="js/axios-0.18.0.min.js"></script>
|
||
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
|
||
</head>
|
||
|
||
<body>
|
||
<div id="app">
|
||
<!-- 定义导航栏 -->
|
||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||
|
||
<div class="container">
|
||
<!-- 导航栏商标 -->
|
||
<div>
|
||
<a class="navbar-brand" href="./index.html">个人博客</a>
|
||
</div>
|
||
<!-- 分类 -->
|
||
<div class="collapse navbar-collapse">
|
||
<div>
|
||
<ul class="nav navbar-nav">
|
||
<li class="nav-item active">
|
||
<a class="nav-link mr-2" href="#">Python</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link mr-2" href="#">Java</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link mr-2" href="#">C</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link mr-2" href="#">C++</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!--登录/个人中心-->
|
||
<div class="navbar-collapse">
|
||
<ul class="nav navbar-nav">
|
||
<!-- 如果用户已经登录，则显示用户名下拉框 -->
|
||
<li class="nav-item dropdown" v-if="is_login">
|
||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" @click="show_menu_click">admin</a>
|
||
<div class="dropdown-menu" aria-labelledby="navbarDropdown" style="display: block" v-show="show_menu">
|
||
<a class="dropdown-item" href="../templates/write_blog.html">写文章</a>
|
||
<a class="dropdown-item" href='./center.html'>个人信息</a>
|
||
<a class="dropdown-item" href='#'>退出登录</a>
|
||
</div>
|
||
</li>
|
||
<!-- 如果用户未登录，则显示登录按钮 -->
|
||
<li class="nav-item" v-else>
|
||
<a class="nav-link" href="login.html">登录</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- content -->
|
||
<div class="container">
|
||
<!-- 列表循环 -->
|
||
<div class="row mt-2">
|
||
<!-- 文章内容 -->
|
||
<!-- 标题图 -->
|
||
<div class="col-3">
|
||
<img src="img/5.png" alt="avatar" style="max-width:100%; border-radius: 20px">
|
||
</div>
|
||
<div class="col">
|
||
<!-- 栏目 -->
|
||
<a role="button" href="#" class="btn btn-sm mb-2 btn-warning">Python</a>
|
||
<!-- 标签 -->
|
||
<span>
|
||
<a href="#" class="badge badge-secondary">Django</a>
|
||
</span>
|
||
<!-- 标题 -->
|
||
<h4>
|
||
<b><a href="./detail.html" style="color: black;">如何更好的学习Django呢？</a></b>
|
||
</h4>
|
||
<!-- 摘要 -->
|
||
<div>
|
||
<p style="color: gray;">
|
||
Python下有许多款不同的 Web 框架。Django是重量级选手中最有代表性的一位。许多成功的网站和APP都基于Django。Django是一个开放源代码的Web应用框架，由Python写成。
|
||
</p>
|
||
</div>
|
||
<!-- 注脚 -->
|
||
<p>
|
||
<!-- 查看、评论、时间 -->
|
||
<span><i class="fas fa-eye" style="color: lightskyblue;"></i>590 </span>
|
||
<span><i class="fas fa-comments" style="color: yellowgreen;"></i>11 </span>
|
||
<span><i class="fas fa-clock" style="color: pink;"></i>2019-10-22</span>
|
||
</p>
|
||
</div>
|
||
<hr style="width: 100%;"/>
|
||
</div>
|
||
|
||
<div class="row mt-2">
|
||
<!-- 文章内容 -->
|
||
<!-- 标题图 -->
|
||
<div class="col-3">
|
||
<img src="img/1.jpg" alt="avatar" style="max-width:100%; border-radius: 20px">
|
||
</div>
|
||
<div class="col">
|
||
<!-- 栏目 -->
|
||
<a role="button" href="#" class="btn btn-sm mb-2 btn-warning">Python</a>
|
||
<!-- 标签 -->
|
||
<span>
|
||
<a href="#" class="badge badge-secondary">Django</a>
|
||
</span>
|
||
<!-- 标题 -->
|
||
<h4>
|
||
<b><a href="detail.html" style="color: black;">如何更好的学习Django呢？</a></b>
|
||
</h4>
|
||
<!-- 摘要 -->
|
||
<div>
|
||
<p style="color: gray;">
|
||
Python下有许多款不同的 Web 框架。Django是重量级选手中最有代表性的一位。许多成功的网站和APP都基于Django。Django是一个开放源代码的Web应用框架，由Python写成。
|
||
</p>
|
||
</div>
|
||
<!-- 注脚 -->
|
||
<p>
|
||
<!-- 转发、评论、时间 -->
|
||
<span><i class="fas fa-eye" style="color: lightskyblue;"></i>590 </span>
|
||
<span><i class="fas fa-comments" style="color: yellowgreen;"></i>11 </span>
|
||
<span><i class="fas fa-clock" style="color: pink;"></i>2019-10-22</span>
|
||
</p>
|
||
</div>
|
||
<hr style="width: 100%;"/>
|
||
</div>
|
||
|
||
<div class="row mt-2">
|
||
<!-- 文章内容 -->
|
||
<!-- 标题图 -->
|
||
<div class="col-3">
|
||
<img src="img/1.jpg" alt="avatar" style="max-width:100%; border-radius: 20px">
|
||
</div>
|
||
<div class="col">
|
||
<!-- 栏目 -->
|
||
<a role="button" href="#" class="btn btn-sm mb-2 btn-warning">Python</a>
|
||
<!-- 标签 -->
|
||
<span>
|
||
<a href="#" class="badge badge-secondary">Django</a>
|
||
</span>
|
||
<!-- 标题 -->
|
||
<h4>
|
||
<b><a href="detail.html" style="color: black;">如何更好的学习Django呢？</a></b>
|
||
</h4>
|
||
<!-- 摘要 -->
|
||
<div>
|
||
<p style="color: gray;">
|
||
Python下有许多款不同的 Web 框架。Django是重量级选手中最有代表性的一位。许多成功的网站和APP都基于Django。Django是一个开放源代码的Web应用框架，由Python写成。
|
||
</p>
|
||
</div>
|
||
<!-- 注脚 -->
|
||
<p>
|
||
<!-- 转发、评论、时间 -->
|
||
<span><i class="fas fa-eye" style="color: lightskyblue;"></i>590 </span>
|
||
<span><i class="fas fa-comments" style="color: yellowgreen;"></i>11 </span>
|
||
<span><i class="fas fa-clock" style="color: pink;"></i>2019-10-22</span>
|
||
</p>
|
||
</div>
|
||
<hr style="width: 100%;"/>
|
||
</div>
|
||
|
||
<div class="row mt-2">
|
||
<!-- 文章内容 -->
|
||
<!-- 标题图 -->
|
||
<div class="col-3">
|
||
<img src="img/1.jpg" alt="avatar" style="max-width:100%; border-radius: 20px">
|
||
</div>
|
||
<div class="col">
|
||
<!-- 栏目 -->
|
||
<a role="button" href="#" class="btn btn-sm mb-2 btn-warning">Python</a>
|
||
<!-- 标签 -->
|
||
<span>
|
||
<a href="#" class="badge badge-secondary">Django</a>
|
||
</span>
|
||
<!-- 标题 -->
|
||
<h4>
|
||
<b><a href="detail.html" style="color: black;">如何更好的学习Django呢？</a></b>
|
||
</h4>
|
||
<!-- 摘要 -->
|
||
<div>
|
||
<p style="color: gray;">
|
||
Python下有许多款不同的 Web 框架。Django是重量级选手中最有代表性的一位。许多成功的网站和APP都基于Django。Django是一个开放源代码的Web应用框架，由Python写成。
|
||
</p>
|
||
</div>
|
||
<!-- 注脚 -->
|
||
<p>
|
||
<!-- 转发、评论、时间 -->
|
||
<span><i class="fas fa-eye" style="color: lightskyblue;"></i>590 </span>
|
||
<span><i class="fas fa-comments" style="color: yellowgreen;"></i>11 </span>
|
||
<span><i class="fas fa-clock" style="color: pink;"></i>2019-10-22</span>
|
||
</p>
|
||
</div>
|
||
<hr style="width: 100%;"/>
|
||
</div>
|
||
|
||
<div class="row mt-2">
|
||
<!-- 文章内容 -->
|
||
<!-- 标题图 -->
|
||
<div class="col-3">
|
||
<img src="img/1.jpg" alt="avatar" style="max-width:100%; border-radius: 20px">
|
||
</div>
|
||
<div class="col">
|
||
<!-- 栏目 -->
|
||
<a role="button" href="#" class="btn btn-sm mb-2 btn-warning">Python</a>
|
||
<!-- 标签 -->
|
||
<span>
|
||
<a href="#" class="badge badge-secondary">Django</a>
|
||
</span>
|
||
<!-- 标题 -->
|
||
<h4>
|
||
<b><a href="detail.html" style="color: black;">如何更好的学习Django呢？</a></b>
|
||
</h4>
|
||
<!-- 摘要 -->
|
||
<div>
|
||
<p style="color: gray;">
|
||
Python下有许多款不同的 Web 框架。Django是重量级选手中最有代表性的一位。许多成功的网站和APP都基于Django。Django是一个开放源代码的Web应用框架，由Python写成。
|
||
</p>
|
||
</div>
|
||
<!-- 注脚 -->
|
||
<p>
|
||
<!-- 转发、评论、时间 -->
|
||
<span><i class="fas fa-eye" style="color: lightskyblue;"></i>590 </span>
|
||
<span><i class="fas fa-comments" style="color: yellowgreen;"></i>11 </span>
|
||
<span><i class="fas fa-clock" style="color: pink;"></i>2019-10-22</span>
|
||
</p>
|
||
</div>
|
||
<hr style="width: 100%;"/>
|
||
</div>
|
||
<!-- 页码导航 -->
|
||
<div class="pagenation" style="text-align: center">
|
||
<div id="pagination" class="page"></div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
|
||
<!-- 引入js -->
|
||
<script type="text/javascript" src="js/host.js"></script>
|
||
<script type="text/javascript" src="js/common.js"></script>
|
||
<script type="text/javascript" src="js/index.js"></script>
|
||
<script type="text/javascript" src="js/jquery.pagination.min.js"></script>
|
||
<script type="text/javascript">
|
||
$(function () {
|
||
$('#pagination').pagination({
|
||
currentPage: 15,
|
||
totalPage: 30,
|
||
callback:function (current) {
|
||
|
||
location.href = '/';
|
||
}
|
||
})
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |