101 lines
3.3 KiB
HTML
101 lines
3.3 KiB
HTML
{% load static %}
|
|
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
{% block sitename %}
|
|
<title>我的个人博客</title>
|
|
{% endblock %}
|
|
<link rel="stylesheet" href="{% static 'bottom.css' %}">
|
|
{% block stylesheethref %}
|
|
{% endblock %}
|
|
|
|
</head>
|
|
<body>
|
|
<!-- 头部 -->
|
|
<header>
|
|
<div class="container header-content">
|
|
<div class="logo"><a href="/">我的博客</a></div>
|
|
|
|
<nav class="nav-links">
|
|
<a href="#">前端技术</a>
|
|
<a href="#">后端开发</a>
|
|
<a href="#">生活随笔</a>
|
|
<a href="#">关于我</a>
|
|
<a href="#">关于我</a>
|
|
</nav>
|
|
|
|
<div class="search-box">
|
|
<input type="text" placeholder="搜索文章...">
|
|
<button><i class="fas fa-search"></i></button>
|
|
</div>
|
|
|
|
<div class="profile">
|
|
<span>欢迎回来</span>
|
|
<img src="http://iph.href.lu/50x50?text=正在开发中" alt="个人头像" class="profile-img">
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- 主要内容区 -->
|
|
<main>
|
|
{% block content %}
|
|
{% endblock %}
|
|
</main>
|
|
|
|
<!-- 底部 -->
|
|
<footer>
|
|
<div class="container">
|
|
<div class="footer-content">
|
|
<div class="footer-section">
|
|
<h3>关于我们</h3>
|
|
<p>这是一个专注于技术分享和个人成长的博客平台，记录我在前端开发、后端技术和生活感悟等方面的思考与实践。</p>
|
|
</div>
|
|
|
|
<div class="footer-section">
|
|
<h3>分类</h3>
|
|
<div class="footer-links">
|
|
<a href="#">前端技术</a>
|
|
<a href="#">后端开发</a>
|
|
<a href="#">数据库</a>
|
|
<a href="#">生活随笔</a>
|
|
<a href="#">读书笔记</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer-section">
|
|
<h3>友情链接</h3>
|
|
<div class="footer-links">
|
|
<a href="#">GitHub</a>
|
|
<a href="#">Stack Overflow</a>
|
|
<a href="#">MDN Web Docs</a>
|
|
<a href="#">掘金</a>
|
|
<a href="#">知乎</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer-section">
|
|
<h3>联系我们</h3>
|
|
<div class="footer-links">
|
|
<a href="mailto:example@example.com">email@example.com</a>
|
|
<a href="#">GitHub</a>
|
|
<a href="#">Twitter</a>
|
|
<a href="#">微信公众号</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="copyright">
|
|
<p>© 2023 我的个人博客 版权所有 | 粤ICP备12345678号</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- 简单的交互功能 -->
|
|
<script>
|
|
{% block script %}
|
|
{% endblock %}
|
|
</script>
|
|
</body>
|
|
</html> |