固定顶部和固定底部

Add HTML

<nav id="nav-box"></nav>
<section class="placeholder"></section>
<section class="placeholder2"></section>
<footer id="footer-box"></footer>

Add CSS

        body{
            margin:0;
        }

        #nav-box {
            position: fixed;
            top: 0;
            left: 0;
            z-index: 2;
            width: 100%;
            height: 60px;
            background-color: red;
        }

        .placeholder {
            position: relative;
            z-index: 1;
            width: 100%;
            height: 2000px;
            background-color: green;
        }

        .placeholder2 {
            position: relative;
            z-index: 1;
            width: 100%;
            height: 2000px;
            background-color: blue;
            margin-bottom: 290px;
        }

        #footer-box {
            position: fixed;
            bottom: 0;
            width: 100%;
            height: 280px;
            background-color: black;
        }