lihe
/
blog


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
							<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的个人博客</title>
    <link rel="stylesheet" href="css/style.css">
    <script defer src="js/script.js"></script>
</head>
<body>
    <header>
        <div class="container">
            <a href="index.php" class="logo">MyBlog</a>
            <nav class="main-nav">
                <ul>
                    <li><a href="index.php" class="active">首页</a></li>
                    <li><a href="about.php">关于我</a></li>
                    <li><a href="portfolio.php">作品集</a></li>
                    <li><a href="contact.php">联系我</a></li>
                </ul>
            </nav>
            <div class="header-controls">
                <button id="theme-switcher" class="control-btn">☀️</button>
                <button class="hamburger control-btn" id="hamburger-menu">
                    <span></span>
                    <span></span>
                    <span></span>
                </button>
            </div>
        </div>
    </header>

    <main>
        <div class="container">
            <div class="carousel">
                <div class="carousel-inner">
                    <div class="carousel-item active">
                        <img src="images/carousel-1.jpg" alt="轮播图一">
                    </div>
                    <div class="carousel-item">
                        <img src="images/carousel-2.png" alt="轮播图二">
                    </div>
                    <div class="carousel-item">
                        <img src="images/carousel-3.jpg" alt="轮播图三">
                    </div>
                </div>
                <button class="carousel-control prev control-btn">&lt;</button>
                <button class="carousel-control next control-btn">&gt;</button>
            </div>
            
            <h1>最新文章</h1>
            <div class="article-list">
                <article class="article-card">
                    <h2>网站设计入门指南</h2>
                    <p class="meta">发布于 2023-10-27</p>
                    <p>这是关于如何开始学习网站设计的第一篇文章，涵盖了HTML, CSS和JavaScript的基础知识...</p>
                    <a href="#" class="btn">阅读全文</a>
                </article>
                <article class="article-card">
                    <h2>CSS Flexbox 布局详解</h2>
                    <p class="meta">发布于 2023-10-25</p>
                    <p>Flexbox是现代CSS布局的核心。本文将通过实例详细讲解其主要属性和应用场景...</p>
                    <a href="#" class="btn">阅读全文</a>
                </article>
            </div>
        </div>
    </main>

    <footer>
        <div class="container">
            <p>&copy; <?php echo date('Y'); ?> 我的个人博客. All Rights Reserved.</p>
            <p>服务器时间: <?php date_default_timezone_set('Asia/Shanghai'); echo date('Y-m-d H:i:s'); ?></p>
        </div>
    </footer>
</body>
</html>