body, html {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
}

header {
    background: #4CAF50;
    color: white;
    padding: 10px 20px;
    text-align: center;
}

nav {
    background: #333;
    overflow: hidden;
}

    nav ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

        nav ul li {
            float: left;
        }

            nav ul li a {
                display: block;
                color: white;
                text-align: center;
                padding: 14px 16px;
                text-decoration: none;
            }

                nav ul li a:hover {
                    background-color: #555;
                }

.container {
    display: flex; /* 使用flex布局 */
}

.left-sidebar {
    flex: 1; /* 侧边栏占据可用空间的一部分 */
    background-color: #f4f4f4;
    padding: 20px;
}

main {
    flex: 3; /* 主要内容占据更多空间 */
    padding: 20px;
}

footer {
    background: #4CAF50;
    color: white;
    text-align: center;
    padding: 10px 0;
    position: absolute; /* 或者使用 fixed 根据需求 */
    bottom: 0; /* 使footer始终位于底部 */
    width: 100%; /* 全宽 */
}